@absolutejs/absolute 0.19.0-beta.705 → 0.19.0-beta.706
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/dist/angular/browser.js +6 -4
- package/dist/angular/browser.js.map +3 -3
- package/dist/angular/index.js +19 -10
- package/dist/angular/index.js.map +3 -3
- package/dist/angular/server.js +19 -10
- package/dist/angular/server.js.map +3 -3
- package/dist/build.js +145 -78
- package/dist/build.js.map +10 -10
- package/dist/cli/index.js +18 -11
- package/dist/client/index.js +4 -2
- package/dist/client/index.js.map +2 -2
- package/dist/index.js +166 -90
- package/dist/index.js.map +12 -12
- package/dist/islands/index.js +5 -3
- package/dist/islands/index.js.map +2 -2
- package/dist/react/browser.js +7 -7
- package/dist/react/browser.js.map +2 -2
- package/dist/react/components/browser/index.js +101 -101
- package/dist/react/components/index.js +104 -104
- package/dist/react/components/index.js.map +2 -2
- package/dist/react/index.js +29 -20
- package/dist/react/index.js.map +3 -3
- package/dist/react/server.js +15 -8
- package/dist/react/server.js.map +3 -3
- package/dist/src/angular/components/defer-slot-templates.directive.d.ts +0 -7
- package/dist/src/angular/components/defer-slot.component.d.ts +2 -5
- package/dist/src/angular/components/image.component.d.ts +2 -5
- package/dist/src/angular/components/index.d.ts +4 -4
- package/dist/src/angular/components/stream-slot.component.d.ts +0 -3
- package/dist/src/build/buildAngularVendor.d.ts +3 -4
- package/dist/src/utils/imageProcessing.d.ts +1 -1
- package/dist/src/vue/components/Image.d.ts +1 -1
- package/dist/svelte/index.js +19 -10
- package/dist/svelte/index.js.map +3 -3
- package/dist/svelte/server.js +16 -9
- package/dist/svelte/server.js.map +3 -3
- package/dist/vue/index.js +19 -10
- package/dist/vue/index.js.map +3 -3
- package/dist/vue/server.js +15 -8
- package/dist/vue/server.js.map +3 -3
- package/package.json +1 -1
- package/dist/angular/components/constants.js +0 -77
- package/dist/angular/components/core/streamingSlotRegistrar.js +0 -58
- package/dist/angular/components/core/streamingSlotRegistry.js +0 -114
- package/dist/angular/components/defer-slot-payload.js +0 -6
- package/dist/angular/components/defer-slot-templates.directive.js +0 -44
- package/dist/angular/components/defer-slot.component.js +0 -149
- package/dist/angular/components/image.component.js +0 -202
- package/dist/angular/components/index.js +0 -4
- package/dist/angular/components/stream-slot.component.js +0 -103
- package/dist/dev/client/constants.ts +0 -26
- package/dist/dev/client/cssUtils.ts +0 -307
- package/dist/dev/client/domDiff.ts +0 -226
- package/dist/dev/client/domState.ts +0 -421
- package/dist/dev/client/domTracker.ts +0 -61
- package/dist/dev/client/errorOverlay.ts +0 -184
- package/dist/dev/client/frameworkDetect.ts +0 -63
- package/dist/dev/client/handlers/angular.ts +0 -551
- package/dist/dev/client/handlers/angularRuntime.ts +0 -206
- package/dist/dev/client/handlers/html.ts +0 -363
- package/dist/dev/client/handlers/htmx.ts +0 -272
- package/dist/dev/client/handlers/react.ts +0 -108
- package/dist/dev/client/handlers/rebuild.ts +0 -153
- package/dist/dev/client/handlers/svelte.ts +0 -332
- package/dist/dev/client/handlers/vue.ts +0 -292
- package/dist/dev/client/headPatch.ts +0 -233
- package/dist/dev/client/hmrClient.ts +0 -251
- package/dist/dev/client/hmrState.ts +0 -14
- package/dist/dev/client/moduleVersions.ts +0 -62
- package/dist/dev/client/reactRefreshSetup.ts +0 -33
- package/dist/src/angular/components/constants.d.ts +0 -74
- package/dist/svelte/components/AwaitSlot.svelte +0 -39
- package/dist/svelte/components/AwaitSlot.svelte.d.ts +0 -2
- package/dist/svelte/components/Head.svelte +0 -144
- package/dist/svelte/components/Head.svelte.d.ts +0 -2
- package/dist/svelte/components/Image.svelte +0 -164
- package/dist/svelte/components/Image.svelte.d.ts +0 -5
- package/dist/svelte/components/Island.svelte +0 -71
- package/dist/svelte/components/Island.svelte.d.ts +0 -5
- package/dist/svelte/components/JsonLd.svelte +0 -21
- package/dist/svelte/components/JsonLd.svelte.d.ts +0 -2
- package/dist/svelte/components/StreamSlot.svelte +0 -41
- package/dist/svelte/components/StreamSlot.svelte.d.ts +0 -2
- package/dist/types/globals.d.ts +0 -121
|
@@ -1,44 +0,0 @@
|
|
|
1
|
-
import { Directive, TemplateRef, inject } from '@angular/core';
|
|
2
|
-
import * as i0 from "@angular/core";
|
|
3
|
-
export class DeferErrorTemplateDirective {
|
|
4
|
-
constructor() {
|
|
5
|
-
this.templateRef = inject(TemplateRef);
|
|
6
|
-
}
|
|
7
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DeferErrorTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
8
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.6", type: DeferErrorTemplateDirective, isStandalone: true, selector: "ng-template[absDeferError]", ngImport: i0 }); }
|
|
9
|
-
}
|
|
10
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DeferErrorTemplateDirective, decorators: [{
|
|
11
|
-
type: Directive,
|
|
12
|
-
args: [{
|
|
13
|
-
selector: 'ng-template[absDeferError]',
|
|
14
|
-
standalone: true
|
|
15
|
-
}]
|
|
16
|
-
}] });
|
|
17
|
-
export class DeferFallbackTemplateDirective {
|
|
18
|
-
constructor() {
|
|
19
|
-
this.templateRef = inject(TemplateRef);
|
|
20
|
-
}
|
|
21
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DeferFallbackTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
22
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.6", type: DeferFallbackTemplateDirective, isStandalone: true, selector: "ng-template[absDeferFallback]", ngImport: i0 }); }
|
|
23
|
-
}
|
|
24
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DeferFallbackTemplateDirective, decorators: [{
|
|
25
|
-
type: Directive,
|
|
26
|
-
args: [{
|
|
27
|
-
selector: 'ng-template[absDeferFallback]',
|
|
28
|
-
standalone: true
|
|
29
|
-
}]
|
|
30
|
-
}] });
|
|
31
|
-
export class DeferResolvedTemplateDirective {
|
|
32
|
-
constructor() {
|
|
33
|
-
this.templateRef = inject(TemplateRef);
|
|
34
|
-
}
|
|
35
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DeferResolvedTemplateDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
36
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "21.2.6", type: DeferResolvedTemplateDirective, isStandalone: true, selector: "ng-template[absDeferResolved]", ngImport: i0 }); }
|
|
37
|
-
}
|
|
38
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DeferResolvedTemplateDirective, decorators: [{
|
|
39
|
-
type: Directive,
|
|
40
|
-
args: [{
|
|
41
|
-
selector: 'ng-template[absDeferResolved]',
|
|
42
|
-
standalone: true
|
|
43
|
-
}]
|
|
44
|
-
}] });
|
|
@@ -1,149 +0,0 @@
|
|
|
1
|
-
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, ContentChild, Input, inject, signal } from '@angular/core';
|
|
2
|
-
import { NgTemplateOutlet } from '@angular/common';
|
|
3
|
-
import { isStreamingSlotCollectionActive, registerStreamingSlot, warnMissingStreamingSlotCollector } from './core/streamingSlotRegistrar.js';
|
|
4
|
-
import { isAngularDeferSlotPayload } from './defer-slot-payload.js';
|
|
5
|
-
import { DeferErrorTemplateDirective, DeferFallbackTemplateDirective, DeferResolvedTemplateDirective } from './defer-slot-templates.directive.js';
|
|
6
|
-
import * as i0 from "@angular/core";
|
|
7
|
-
export class DeferSlotComponent {
|
|
8
|
-
constructor() {
|
|
9
|
-
this.cdr = inject(ChangeDetectorRef);
|
|
10
|
-
this.runtimeReady = signal(false, ...(ngDevMode ? [{ debugName: "runtimeReady" }] : /* istanbul ignore next */ []));
|
|
11
|
-
this.serverSlotRegistered = false;
|
|
12
|
-
this.id = '';
|
|
13
|
-
this.slotData = signal({}, ...(ngDevMode ? [{ debugName: "slotData" }] : /* istanbul ignore next */ []));
|
|
14
|
-
this.state = signal('fallback', ...(ngDevMode ? [{ debugName: "state" }] : /* istanbul ignore next */ []));
|
|
15
|
-
this.activeTemplate = () => {
|
|
16
|
-
if (this.state() === 'resolved') {
|
|
17
|
-
return this.resolvedTemplate?.templateRef ?? null;
|
|
18
|
-
}
|
|
19
|
-
if (this.state() === 'error') {
|
|
20
|
-
return (this.errorTemplate?.templateRef ??
|
|
21
|
-
this.fallbackTemplate?.templateRef ??
|
|
22
|
-
null);
|
|
23
|
-
}
|
|
24
|
-
return (this.fallbackTemplate?.templateRef ??
|
|
25
|
-
this.resolvedTemplate?.templateRef ??
|
|
26
|
-
null);
|
|
27
|
-
};
|
|
28
|
-
this.templateContext = () => {
|
|
29
|
-
const slotData = this.slotData();
|
|
30
|
-
return {
|
|
31
|
-
$implicit: slotData,
|
|
32
|
-
slotData
|
|
33
|
-
};
|
|
34
|
-
};
|
|
35
|
-
}
|
|
36
|
-
ngOnInit() {
|
|
37
|
-
const { id } = this;
|
|
38
|
-
if (!id)
|
|
39
|
-
return;
|
|
40
|
-
if (this.registerServerSlot()) {
|
|
41
|
-
return;
|
|
42
|
-
}
|
|
43
|
-
const consumers = (window.__ABS_SLOT_CONSUMERS__ =
|
|
44
|
-
window.__ABS_SLOT_CONSUMERS__ ?? {});
|
|
45
|
-
consumers[id] = (payload) => {
|
|
46
|
-
if (!this.runtimeReady())
|
|
47
|
-
return false;
|
|
48
|
-
this.applyPatchPayload(payload);
|
|
49
|
-
return true;
|
|
50
|
-
};
|
|
51
|
-
}
|
|
52
|
-
ngAfterViewInit() {
|
|
53
|
-
if (this.registerServerSlot())
|
|
54
|
-
return;
|
|
55
|
-
if (typeof window === 'undefined')
|
|
56
|
-
return;
|
|
57
|
-
requestAnimationFrame(() => {
|
|
58
|
-
this.runtimeReady.set(true);
|
|
59
|
-
this.cdr.markForCheck();
|
|
60
|
-
window.__ABS_SLOT_FLUSH__?.();
|
|
61
|
-
});
|
|
62
|
-
}
|
|
63
|
-
ngOnDestroy() {
|
|
64
|
-
if (typeof window === 'undefined')
|
|
65
|
-
return;
|
|
66
|
-
const { id } = this;
|
|
67
|
-
if (!id)
|
|
68
|
-
return;
|
|
69
|
-
delete window.__ABS_SLOT_CONSUMERS__?.[id];
|
|
70
|
-
}
|
|
71
|
-
registerServerSlot() {
|
|
72
|
-
const { id, resolve } = this;
|
|
73
|
-
if (this.serverSlotRegistered || !id || !resolve) {
|
|
74
|
-
return false;
|
|
75
|
-
}
|
|
76
|
-
if (!isStreamingSlotCollectionActive()) {
|
|
77
|
-
warnMissingStreamingSlotCollector('DeferSlot');
|
|
78
|
-
return false;
|
|
79
|
-
}
|
|
80
|
-
registerStreamingSlot({
|
|
81
|
-
id,
|
|
82
|
-
resolve
|
|
83
|
-
});
|
|
84
|
-
this.serverSlotRegistered = true;
|
|
85
|
-
return true;
|
|
86
|
-
}
|
|
87
|
-
applyPatchPayload(payload) {
|
|
88
|
-
if (payload === null || typeof payload === 'undefined')
|
|
89
|
-
return;
|
|
90
|
-
if (isAngularDeferSlotPayload(payload)) {
|
|
91
|
-
const data = payload.data && typeof payload.data === 'object'
|
|
92
|
-
? payload.data
|
|
93
|
-
: {};
|
|
94
|
-
this.slotData.set(data);
|
|
95
|
-
this.state.set(payload.state === 'error' ? 'error' : 'resolved');
|
|
96
|
-
this.cdr.markForCheck();
|
|
97
|
-
return;
|
|
98
|
-
}
|
|
99
|
-
this.slotData.set({});
|
|
100
|
-
this.state.set(payload === '' ? 'fallback' : 'resolved');
|
|
101
|
-
this.cdr.markForCheck();
|
|
102
|
-
}
|
|
103
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DeferSlotComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
104
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: DeferSlotComponent, isStandalone: true, selector: "abs-defer-slot", inputs: { className: "className", id: "id", resolve: "resolve" }, queries: [{ propertyName: "resolvedTemplate", first: true, predicate: DeferResolvedTemplateDirective, descendants: true }, { propertyName: "fallbackTemplate", first: true, predicate: DeferFallbackTemplateDirective, descendants: true }, { propertyName: "errorTemplate", first: true, predicate: DeferErrorTemplateDirective, descendants: true }], ngImport: i0, template: `
|
|
105
|
-
<div [attr.id]="id" [attr.class]="className" data-absolute-slot="true">
|
|
106
|
-
<ng-container
|
|
107
|
-
[ngTemplateOutlet]="activeTemplate()"
|
|
108
|
-
[ngTemplateOutletContext]="templateContext()"
|
|
109
|
-
></ng-container>
|
|
110
|
-
</div>
|
|
111
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
112
|
-
}
|
|
113
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: DeferSlotComponent, decorators: [{
|
|
114
|
-
type: Component,
|
|
115
|
-
args: [{
|
|
116
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
117
|
-
imports: [
|
|
118
|
-
NgTemplateOutlet,
|
|
119
|
-
DeferResolvedTemplateDirective,
|
|
120
|
-
DeferFallbackTemplateDirective,
|
|
121
|
-
DeferErrorTemplateDirective
|
|
122
|
-
],
|
|
123
|
-
selector: 'abs-defer-slot',
|
|
124
|
-
standalone: true,
|
|
125
|
-
template: `
|
|
126
|
-
<div [attr.id]="id" [attr.class]="className" data-absolute-slot="true">
|
|
127
|
-
<ng-container
|
|
128
|
-
[ngTemplateOutlet]="activeTemplate()"
|
|
129
|
-
[ngTemplateOutletContext]="templateContext()"
|
|
130
|
-
></ng-container>
|
|
131
|
-
</div>
|
|
132
|
-
`
|
|
133
|
-
}]
|
|
134
|
-
}], propDecorators: { className: [{
|
|
135
|
-
type: Input
|
|
136
|
-
}], id: [{
|
|
137
|
-
type: Input
|
|
138
|
-
}], resolve: [{
|
|
139
|
-
type: Input
|
|
140
|
-
}], resolvedTemplate: [{
|
|
141
|
-
type: ContentChild,
|
|
142
|
-
args: [DeferResolvedTemplateDirective]
|
|
143
|
-
}], fallbackTemplate: [{
|
|
144
|
-
type: ContentChild,
|
|
145
|
-
args: [DeferFallbackTemplateDirective]
|
|
146
|
-
}], errorTemplate: [{
|
|
147
|
-
type: ContentChild,
|
|
148
|
-
args: [DeferErrorTemplateDirective]
|
|
149
|
-
}] } });
|
|
@@ -1,202 +0,0 @@
|
|
|
1
|
-
import { Component, computed, input, signal } from '@angular/core';
|
|
2
|
-
import { NgStyle } from '@angular/common';
|
|
3
|
-
import { DEFAULT_QUALITY, buildOptimizedUrl, generateBlurSvg, generateSrcSet } from '@absolutejs/absolute/image';
|
|
4
|
-
import * as i0 from "@angular/core";
|
|
5
|
-
/** Resolve the blur background CSS value from placeholder config */
|
|
6
|
-
const resolveBlurBg = (placeholderValue, blurDataUrl) => {
|
|
7
|
-
if (typeof placeholderValue === 'string' &&
|
|
8
|
-
placeholderValue !== 'blur' &&
|
|
9
|
-
placeholderValue.startsWith('data:')) {
|
|
10
|
-
return generateBlurSvg(placeholderValue);
|
|
11
|
-
}
|
|
12
|
-
if (blurDataUrl)
|
|
13
|
-
return generateBlurSvg(blurDataUrl);
|
|
14
|
-
return undefined;
|
|
15
|
-
};
|
|
16
|
-
export class ImageComponent {
|
|
17
|
-
constructor() {
|
|
18
|
-
// ── Inputs ──────────────────────────────────────────────────
|
|
19
|
-
this.alt = input.required(...(ngDevMode ? [{ debugName: "alt" }] : /* istanbul ignore next */ []));
|
|
20
|
-
this.blurDataURL = input(...(ngDevMode ? [undefined, { debugName: "blurDataURL" }] : /* istanbul ignore next */ []));
|
|
21
|
-
this.className = input(...(ngDevMode ? [undefined, { debugName: "className" }] : /* istanbul ignore next */ []));
|
|
22
|
-
this.crossOrigin = input(...(ngDevMode ? [undefined, { debugName: "crossOrigin" }] : /* istanbul ignore next */ []));
|
|
23
|
-
this.fetchPriority = input(...(ngDevMode ? [undefined, { debugName: "fetchPriority" }] : /* istanbul ignore next */ []));
|
|
24
|
-
this.fill = input(false, ...(ngDevMode ? [{ debugName: "fill" }] : /* istanbul ignore next */ []));
|
|
25
|
-
this.height = input(...(ngDevMode ? [undefined, { debugName: "height" }] : /* istanbul ignore next */ []));
|
|
26
|
-
this.loader = input(...(ngDevMode ? [undefined, { debugName: "loader" }] : /* istanbul ignore next */ []));
|
|
27
|
-
this.loading = input('lazy', ...(ngDevMode ? [{ debugName: "loading" }] : /* istanbul ignore next */ []));
|
|
28
|
-
this.onError = input(...(ngDevMode ? [undefined, { debugName: "onError" }] : /* istanbul ignore next */ []));
|
|
29
|
-
this.onLoad = input(...(ngDevMode ? [undefined, { debugName: "onLoad" }] : /* istanbul ignore next */ []));
|
|
30
|
-
this.overrideSrc = input(...(ngDevMode ? [undefined, { debugName: "overrideSrc" }] : /* istanbul ignore next */ []));
|
|
31
|
-
this.placeholder = input('empty', ...(ngDevMode ? [{ debugName: "placeholder" }] : /* istanbul ignore next */ []));
|
|
32
|
-
this.priority = input(false, ...(ngDevMode ? [{ debugName: "priority" }] : /* istanbul ignore next */ []));
|
|
33
|
-
this.quality = input(DEFAULT_QUALITY, ...(ngDevMode ? [{ debugName: "quality" }] : /* istanbul ignore next */ []));
|
|
34
|
-
this.referrerPolicy = input(...(ngDevMode ? [undefined, { debugName: "referrerPolicy" }] : /* istanbul ignore next */ []));
|
|
35
|
-
this.sizes = input(...(ngDevMode ? [undefined, { debugName: "sizes" }] : /* istanbul ignore next */ []));
|
|
36
|
-
this.src = input.required(...(ngDevMode ? [{ debugName: "src" }] : /* istanbul ignore next */ []));
|
|
37
|
-
this.style = input(...(ngDevMode ? [undefined, { debugName: "style" }] : /* istanbul ignore next */ []));
|
|
38
|
-
this.unoptimized = input(false, ...(ngDevMode ? [{ debugName: "unoptimized" }] : /* istanbul ignore next */ []));
|
|
39
|
-
this.width = input(...(ngDevMode ? [undefined, { debugName: "width" }] : /* istanbul ignore next */ []));
|
|
40
|
-
// ── Internal state ──────────────────────────────────────────
|
|
41
|
-
this.blurRemoved = signal(false, ...(ngDevMode ? [{ debugName: "blurRemoved" }] : /* istanbul ignore next */ []));
|
|
42
|
-
// ── Computed ────────────────────────────────────────────────
|
|
43
|
-
this.resolvedSrc = computed(() => {
|
|
44
|
-
const override = this.overrideSrc();
|
|
45
|
-
if (override)
|
|
46
|
-
return override;
|
|
47
|
-
if (this.unoptimized())
|
|
48
|
-
return this.src();
|
|
49
|
-
const loaderFn = this.loader();
|
|
50
|
-
if (loaderFn)
|
|
51
|
-
return loaderFn({
|
|
52
|
-
quality: this.quality(),
|
|
53
|
-
src: this.src(),
|
|
54
|
-
width: this.width() ?? 0
|
|
55
|
-
});
|
|
56
|
-
const currentWidth = this.width();
|
|
57
|
-
if (!currentWidth)
|
|
58
|
-
return buildOptimizedUrl(this.src(), 0, this.quality());
|
|
59
|
-
return buildOptimizedUrl(this.src(), currentWidth, this.quality());
|
|
60
|
-
}, ...(ngDevMode ? [{ debugName: "resolvedSrc" }] : /* istanbul ignore next */ []));
|
|
61
|
-
this.srcSet = computed(() => this.unoptimized()
|
|
62
|
-
? null
|
|
63
|
-
: (generateSrcSet(this.src(), this.width(), this.sizes(), undefined, this.loader() ?? undefined) ?? null), ...(ngDevMode ? [{ debugName: "srcSet" }] : /* istanbul ignore next */ []));
|
|
64
|
-
this.resolvedSrcSet = computed(() => this.srcSet() ?? null, ...(ngDevMode ? [{ debugName: "resolvedSrcSet" }] : /* istanbul ignore next */ []));
|
|
65
|
-
this.resolvedSizes = computed(() => this.sizes() ?? (this.fill() ? '100vw' : null), ...(ngDevMode ? [{ debugName: "resolvedSizes" }] : /* istanbul ignore next */ []));
|
|
66
|
-
this.resolvedCrossOrigin = computed(() => this.crossOrigin() ?? null, ...(ngDevMode ? [{ debugName: "resolvedCrossOrigin" }] : /* istanbul ignore next */ []));
|
|
67
|
-
this.resolvedReferrerPolicy = computed(() => this.referrerPolicy() ?? null, ...(ngDevMode ? [{ debugName: "resolvedReferrerPolicy" }] : /* istanbul ignore next */ []));
|
|
68
|
-
this.resolvedLoading = computed(() => this.priority() ? 'eager' : this.loading(), ...(ngDevMode ? [{ debugName: "resolvedLoading" }] : /* istanbul ignore next */ []));
|
|
69
|
-
this.resolvedFetchPriority = computed(() => this.priority() ? 'high' : (this.fetchPriority() ?? null), ...(ngDevMode ? [{ debugName: "resolvedFetchPriority" }] : /* istanbul ignore next */ []));
|
|
70
|
-
this.imgStyle = computed(() => {
|
|
71
|
-
const base = {
|
|
72
|
-
...(this.style() ?? {}),
|
|
73
|
-
color: 'transparent'
|
|
74
|
-
};
|
|
75
|
-
const hasBlur = !this.blurRemoved() &&
|
|
76
|
-
(this.placeholder() === 'blur' ||
|
|
77
|
-
(typeof this.placeholder() === 'string' &&
|
|
78
|
-
this.placeholder() !== 'empty' &&
|
|
79
|
-
(this.placeholder() ?? '').startsWith('data:')));
|
|
80
|
-
const blurValue = hasBlur
|
|
81
|
-
? resolveBlurBg(this.placeholder(), this.blurDataURL())
|
|
82
|
-
: undefined;
|
|
83
|
-
if (blurValue) {
|
|
84
|
-
base['background-image'] = blurValue;
|
|
85
|
-
base['background-position'] = 'center';
|
|
86
|
-
base['background-repeat'] = 'no-repeat';
|
|
87
|
-
base['background-size'] = 'cover';
|
|
88
|
-
}
|
|
89
|
-
if (this.fill()) {
|
|
90
|
-
base.height = '100%';
|
|
91
|
-
base.inset = '0';
|
|
92
|
-
base['object-fit'] = 'cover';
|
|
93
|
-
base.position = 'absolute';
|
|
94
|
-
base.width = '100%';
|
|
95
|
-
}
|
|
96
|
-
return base;
|
|
97
|
-
}, ...(ngDevMode ? [{ debugName: "imgStyle" }] : /* istanbul ignore next */ []));
|
|
98
|
-
}
|
|
99
|
-
// ── Event handlers ──────────────────────────────────────────
|
|
100
|
-
handleLoad(event) {
|
|
101
|
-
this.blurRemoved.set(true);
|
|
102
|
-
const callback = this.onLoad();
|
|
103
|
-
if (callback)
|
|
104
|
-
callback(event);
|
|
105
|
-
}
|
|
106
|
-
handleError(event) {
|
|
107
|
-
const callback = this.onError();
|
|
108
|
-
if (callback)
|
|
109
|
-
callback(event);
|
|
110
|
-
}
|
|
111
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ImageComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
112
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.6", type: ImageComponent, isStandalone: true, selector: "abs-image", inputs: { alt: { classPropertyName: "alt", publicName: "alt", isSignal: true, isRequired: true, transformFunction: null }, blurDataURL: { classPropertyName: "blurDataURL", publicName: "blurDataURL", isSignal: true, isRequired: false, transformFunction: null }, className: { classPropertyName: "className", publicName: "className", isSignal: true, isRequired: false, transformFunction: null }, crossOrigin: { classPropertyName: "crossOrigin", publicName: "crossOrigin", isSignal: true, isRequired: false, transformFunction: null }, fetchPriority: { classPropertyName: "fetchPriority", publicName: "fetchPriority", isSignal: true, isRequired: false, transformFunction: null }, fill: { classPropertyName: "fill", publicName: "fill", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, loader: { classPropertyName: "loader", publicName: "loader", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, onError: { classPropertyName: "onError", publicName: "onError", isSignal: true, isRequired: false, transformFunction: null }, onLoad: { classPropertyName: "onLoad", publicName: "onLoad", isSignal: true, isRequired: false, transformFunction: null }, overrideSrc: { classPropertyName: "overrideSrc", publicName: "overrideSrc", isSignal: true, isRequired: false, transformFunction: null }, placeholder: { classPropertyName: "placeholder", publicName: "placeholder", isSignal: true, isRequired: false, transformFunction: null }, priority: { classPropertyName: "priority", publicName: "priority", isSignal: true, isRequired: false, transformFunction: null }, quality: { classPropertyName: "quality", publicName: "quality", isSignal: true, isRequired: false, transformFunction: null }, referrerPolicy: { classPropertyName: "referrerPolicy", publicName: "referrerPolicy", isSignal: true, isRequired: false, transformFunction: null }, sizes: { classPropertyName: "sizes", publicName: "sizes", isSignal: true, isRequired: false, transformFunction: null }, src: { classPropertyName: "src", publicName: "src", isSignal: true, isRequired: true, transformFunction: null }, style: { classPropertyName: "style", publicName: "style", isSignal: true, isRequired: false, transformFunction: null }, unoptimized: { classPropertyName: "unoptimized", publicName: "unoptimized", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: `
|
|
113
|
-
@if (fill()) {
|
|
114
|
-
<span
|
|
115
|
-
style="position:relative;overflow:hidden;display:block;width:100%;height:100%"
|
|
116
|
-
>
|
|
117
|
-
<img
|
|
118
|
-
[alt]="alt()"
|
|
119
|
-
[src]="resolvedSrc()"
|
|
120
|
-
[attr.srcset]="resolvedSrcSet()"
|
|
121
|
-
[attr.sizes]="resolvedSizes()"
|
|
122
|
-
[loading]="resolvedLoading()"
|
|
123
|
-
[class]="className()"
|
|
124
|
-
[ngStyle]="imgStyle()"
|
|
125
|
-
[attr.crossorigin]="resolvedCrossOrigin()"
|
|
126
|
-
[attr.referrerpolicy]="resolvedReferrerPolicy()"
|
|
127
|
-
[attr.fetchpriority]="resolvedFetchPriority()"
|
|
128
|
-
decoding="async"
|
|
129
|
-
(load)="handleLoad($event)"
|
|
130
|
-
(error)="handleError($event)"
|
|
131
|
-
/>
|
|
132
|
-
</span>
|
|
133
|
-
} @else {
|
|
134
|
-
<img
|
|
135
|
-
[alt]="alt()"
|
|
136
|
-
[src]="resolvedSrc()"
|
|
137
|
-
[attr.srcset]="resolvedSrcSet()"
|
|
138
|
-
[attr.sizes]="resolvedSizes()"
|
|
139
|
-
[width]="width()"
|
|
140
|
-
[height]="height()"
|
|
141
|
-
[loading]="resolvedLoading()"
|
|
142
|
-
[class]="className()"
|
|
143
|
-
[ngStyle]="imgStyle()"
|
|
144
|
-
[attr.crossorigin]="resolvedCrossOrigin()"
|
|
145
|
-
[attr.referrerpolicy]="resolvedReferrerPolicy()"
|
|
146
|
-
[attr.fetchpriority]="resolvedFetchPriority()"
|
|
147
|
-
decoding="async"
|
|
148
|
-
(load)="handleLoad($event)"
|
|
149
|
-
(error)="handleError($event)"
|
|
150
|
-
/>
|
|
151
|
-
}
|
|
152
|
-
`, isInline: true, dependencies: [{ kind: "directive", type: NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }] }); }
|
|
153
|
-
}
|
|
154
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: ImageComponent, decorators: [{
|
|
155
|
-
type: Component,
|
|
156
|
-
args: [{
|
|
157
|
-
imports: [NgStyle],
|
|
158
|
-
selector: 'abs-image',
|
|
159
|
-
standalone: true,
|
|
160
|
-
template: `
|
|
161
|
-
@if (fill()) {
|
|
162
|
-
<span
|
|
163
|
-
style="position:relative;overflow:hidden;display:block;width:100%;height:100%"
|
|
164
|
-
>
|
|
165
|
-
<img
|
|
166
|
-
[alt]="alt()"
|
|
167
|
-
[src]="resolvedSrc()"
|
|
168
|
-
[attr.srcset]="resolvedSrcSet()"
|
|
169
|
-
[attr.sizes]="resolvedSizes()"
|
|
170
|
-
[loading]="resolvedLoading()"
|
|
171
|
-
[class]="className()"
|
|
172
|
-
[ngStyle]="imgStyle()"
|
|
173
|
-
[attr.crossorigin]="resolvedCrossOrigin()"
|
|
174
|
-
[attr.referrerpolicy]="resolvedReferrerPolicy()"
|
|
175
|
-
[attr.fetchpriority]="resolvedFetchPriority()"
|
|
176
|
-
decoding="async"
|
|
177
|
-
(load)="handleLoad($event)"
|
|
178
|
-
(error)="handleError($event)"
|
|
179
|
-
/>
|
|
180
|
-
</span>
|
|
181
|
-
} @else {
|
|
182
|
-
<img
|
|
183
|
-
[alt]="alt()"
|
|
184
|
-
[src]="resolvedSrc()"
|
|
185
|
-
[attr.srcset]="resolvedSrcSet()"
|
|
186
|
-
[attr.sizes]="resolvedSizes()"
|
|
187
|
-
[width]="width()"
|
|
188
|
-
[height]="height()"
|
|
189
|
-
[loading]="resolvedLoading()"
|
|
190
|
-
[class]="className()"
|
|
191
|
-
[ngStyle]="imgStyle()"
|
|
192
|
-
[attr.crossorigin]="resolvedCrossOrigin()"
|
|
193
|
-
[attr.referrerpolicy]="resolvedReferrerPolicy()"
|
|
194
|
-
[attr.fetchpriority]="resolvedFetchPriority()"
|
|
195
|
-
decoding="async"
|
|
196
|
-
(load)="handleLoad($event)"
|
|
197
|
-
(error)="handleError($event)"
|
|
198
|
-
/>
|
|
199
|
-
}
|
|
200
|
-
`
|
|
201
|
-
}]
|
|
202
|
-
}], propDecorators: { alt: [{ type: i0.Input, args: [{ isSignal: true, alias: "alt", required: true }] }], blurDataURL: [{ type: i0.Input, args: [{ isSignal: true, alias: "blurDataURL", required: false }] }], className: [{ type: i0.Input, args: [{ isSignal: true, alias: "className", required: false }] }], crossOrigin: [{ type: i0.Input, args: [{ isSignal: true, alias: "crossOrigin", required: false }] }], fetchPriority: [{ type: i0.Input, args: [{ isSignal: true, alias: "fetchPriority", required: false }] }], fill: [{ type: i0.Input, args: [{ isSignal: true, alias: "fill", required: false }] }], height: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], loader: [{ type: i0.Input, args: [{ isSignal: true, alias: "loader", required: false }] }], loading: [{ type: i0.Input, args: [{ isSignal: true, alias: "loading", required: false }] }], onError: [{ type: i0.Input, args: [{ isSignal: true, alias: "onError", required: false }] }], onLoad: [{ type: i0.Input, args: [{ isSignal: true, alias: "onLoad", required: false }] }], overrideSrc: [{ type: i0.Input, args: [{ isSignal: true, alias: "overrideSrc", required: false }] }], placeholder: [{ type: i0.Input, args: [{ isSignal: true, alias: "placeholder", required: false }] }], priority: [{ type: i0.Input, args: [{ isSignal: true, alias: "priority", required: false }] }], quality: [{ type: i0.Input, args: [{ isSignal: true, alias: "quality", required: false }] }], referrerPolicy: [{ type: i0.Input, args: [{ isSignal: true, alias: "referrerPolicy", required: false }] }], sizes: [{ type: i0.Input, args: [{ isSignal: true, alias: "sizes", required: false }] }], src: [{ type: i0.Input, args: [{ isSignal: true, alias: "src", required: true }] }], style: [{ type: i0.Input, args: [{ isSignal: true, alias: "style", required: false }] }], unoptimized: [{ type: i0.Input, args: [{ isSignal: true, alias: "unoptimized", required: false }] }], width: [{ type: i0.Input, args: [{ isSignal: true, alias: "width", required: false }] }] } });
|
|
@@ -1,4 +0,0 @@
|
|
|
1
|
-
export { DeferSlotComponent } from './defer-slot.component.js';
|
|
2
|
-
export { DeferErrorTemplateDirective, DeferFallbackTemplateDirective, DeferResolvedTemplateDirective } from './defer-slot-templates.directive.js';
|
|
3
|
-
export { ImageComponent } from './image.component.js';
|
|
4
|
-
export { StreamSlotComponent } from './stream-slot.component.js';
|
|
@@ -1,103 +0,0 @@
|
|
|
1
|
-
import { ChangeDetectionStrategy, ChangeDetectorRef, Component, Input, NgZone, inject, signal } from '@angular/core';
|
|
2
|
-
import { DomSanitizer } from '@angular/platform-browser';
|
|
3
|
-
import { isStreamingSlotCollectionActive, registerStreamingSlot, warnMissingStreamingSlotCollector } from './core/streamingSlotRegistrar.js';
|
|
4
|
-
import * as i0 from "@angular/core";
|
|
5
|
-
const isObjectRecord = (value) => Boolean(value) && typeof value === 'object';
|
|
6
|
-
const isHtmlPayload = (payload) => isObjectRecord(payload) && typeof payload.html === 'string';
|
|
7
|
-
const resolvePayloadHtml = (payload) => {
|
|
8
|
-
if (isHtmlPayload(payload)) {
|
|
9
|
-
return payload.html;
|
|
10
|
-
}
|
|
11
|
-
return typeof payload === 'string' ? payload : '';
|
|
12
|
-
};
|
|
13
|
-
export class StreamSlotComponent {
|
|
14
|
-
constructor() {
|
|
15
|
-
this.cdr = inject(ChangeDetectorRef);
|
|
16
|
-
this.sanitizer = inject(DomSanitizer);
|
|
17
|
-
this.zone = inject(NgZone);
|
|
18
|
-
this.slotConsumer = (payload) => {
|
|
19
|
-
this.zone.run(() => {
|
|
20
|
-
this.currentHtml.set(this.sanitizer.bypassSecurityTrustHtml(resolvePayloadHtml(payload)));
|
|
21
|
-
this.cdr.markForCheck();
|
|
22
|
-
});
|
|
23
|
-
return true;
|
|
24
|
-
};
|
|
25
|
-
this.fallbackHtml = '';
|
|
26
|
-
this.currentHtml = signal('', ...(ngDevMode ? [{ debugName: "currentHtml" }] : /* istanbul ignore next */ []));
|
|
27
|
-
}
|
|
28
|
-
ngOnInit() {
|
|
29
|
-
if (isStreamingSlotCollectionActive()) {
|
|
30
|
-
this.currentHtml.set(this.sanitizer.bypassSecurityTrustHtml(this.fallbackHtml));
|
|
31
|
-
registerStreamingSlot({
|
|
32
|
-
errorHtml: this.errorHtml,
|
|
33
|
-
fallbackHtml: this.fallbackHtml,
|
|
34
|
-
id: this.id,
|
|
35
|
-
resolve: this.resolve,
|
|
36
|
-
timeoutMs: this.timeoutMs
|
|
37
|
-
});
|
|
38
|
-
return;
|
|
39
|
-
}
|
|
40
|
-
warnMissingStreamingSlotCollector('StreamSlot');
|
|
41
|
-
if (typeof window === 'undefined') {
|
|
42
|
-
this.currentHtml.set(this.sanitizer.bypassSecurityTrustHtml(this.fallbackHtml));
|
|
43
|
-
return;
|
|
44
|
-
}
|
|
45
|
-
const consumers = (window.__ABS_SLOT_CONSUMERS__ =
|
|
46
|
-
window.__ABS_SLOT_CONSUMERS__ ?? {});
|
|
47
|
-
consumers[this.id] = this.slotConsumer;
|
|
48
|
-
this.currentHtml.set(this.sanitizer.bypassSecurityTrustHtml(this.fallbackHtml));
|
|
49
|
-
const pendingPayload = window.__ABS_SLOT_PENDING__?.[this.id];
|
|
50
|
-
if (pendingPayload !== undefined) {
|
|
51
|
-
this.slotConsumer(pendingPayload);
|
|
52
|
-
delete window.__ABS_SLOT_PENDING__?.[this.id];
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
ngOnDestroy() {
|
|
56
|
-
if (typeof window === 'undefined')
|
|
57
|
-
return;
|
|
58
|
-
if (window.__ABS_SLOT_CONSUMERS__) {
|
|
59
|
-
delete window.__ABS_SLOT_CONSUMERS__[this.id];
|
|
60
|
-
}
|
|
61
|
-
}
|
|
62
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: StreamSlotComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
63
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.6", type: StreamSlotComponent, isStandalone: true, selector: "abs-stream-slot", inputs: { className: "className", errorHtml: "errorHtml", fallbackHtml: "fallbackHtml", id: "id", resolve: "resolve", timeoutMs: "timeoutMs" }, ngImport: i0, template: `
|
|
64
|
-
<div
|
|
65
|
-
[attr.id]="id"
|
|
66
|
-
[attr.class]="className"
|
|
67
|
-
data-absolute-raw-slot="true"
|
|
68
|
-
data-absolute-slot="true"
|
|
69
|
-
[innerHTML]="currentHtml()"
|
|
70
|
-
></div>
|
|
71
|
-
`, isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
72
|
-
}
|
|
73
|
-
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.6", ngImport: i0, type: StreamSlotComponent, decorators: [{
|
|
74
|
-
type: Component,
|
|
75
|
-
args: [{
|
|
76
|
-
changeDetection: ChangeDetectionStrategy.OnPush,
|
|
77
|
-
selector: 'abs-stream-slot',
|
|
78
|
-
standalone: true,
|
|
79
|
-
template: `
|
|
80
|
-
<div
|
|
81
|
-
[attr.id]="id"
|
|
82
|
-
[attr.class]="className"
|
|
83
|
-
data-absolute-raw-slot="true"
|
|
84
|
-
data-absolute-slot="true"
|
|
85
|
-
[innerHTML]="currentHtml()"
|
|
86
|
-
></div>
|
|
87
|
-
`
|
|
88
|
-
}]
|
|
89
|
-
}], propDecorators: { className: [{
|
|
90
|
-
type: Input
|
|
91
|
-
}], errorHtml: [{
|
|
92
|
-
type: Input
|
|
93
|
-
}], fallbackHtml: [{
|
|
94
|
-
type: Input
|
|
95
|
-
}], id: [{
|
|
96
|
-
type: Input,
|
|
97
|
-
args: [{ required: true }]
|
|
98
|
-
}], resolve: [{
|
|
99
|
-
type: Input,
|
|
100
|
-
args: [{ required: true }]
|
|
101
|
-
}], timeoutMs: [{
|
|
102
|
-
type: Input
|
|
103
|
-
}] } });
|
|
@@ -1,26 +0,0 @@
|
|
|
1
|
-
import type {} from '../../types/globals';
|
|
2
|
-
/* Client-side constants — local copy for dist/dev/client/ portability.
|
|
3
|
-
These values MUST stay in sync with the root constants.ts.
|
|
4
|
-
This file exists because the client files are copied raw to dist/dev/client/
|
|
5
|
-
and cannot import from ../../constants when installed from npm. */
|
|
6
|
-
|
|
7
|
-
export const ANGULAR_INIT_TIMEOUT_MS = 500;
|
|
8
|
-
export const CSS_ERROR_RESOLVE_DELAY_MS = 50;
|
|
9
|
-
export const CSS_MAX_CHECK_ATTEMPTS = 10;
|
|
10
|
-
export const CSS_MAX_PARSE_TIMEOUT_MS = 500;
|
|
11
|
-
export const CSS_SHEET_READY_TIMEOUT_MS = 100;
|
|
12
|
-
export const DOM_UPDATE_DELAY_MS = 50;
|
|
13
|
-
export const FOCUS_ID_PREFIX_LENGTH = 3;
|
|
14
|
-
export const FOCUS_IDX_PREFIX_LENGTH = 4;
|
|
15
|
-
export const FOCUS_NAME_PREFIX_LENGTH = 5;
|
|
16
|
-
export const HMR_UPDATE_TIMEOUT_MS = 2000;
|
|
17
|
-
export const MAX_RECONNECT_ATTEMPTS = 60;
|
|
18
|
-
export const OVERLAY_FADE_DURATION_MS = 150;
|
|
19
|
-
export const PING_INTERVAL_MS = 30_000;
|
|
20
|
-
export const RAF_BATCH_COUNT = 3;
|
|
21
|
-
export const REBUILD_RELOAD_DELAY_MS = 200;
|
|
22
|
-
export const RECONNECT_INITIAL_DELAY_MS = 500;
|
|
23
|
-
export const RECONNECT_POLL_INTERVAL_MS = 300;
|
|
24
|
-
export const SVELTE_CSS_LOAD_TIMEOUT_MS = 500;
|
|
25
|
-
export const UNFOUND_INDEX = -1;
|
|
26
|
-
export const WEBSOCKET_NORMAL_CLOSURE = 1000;
|