piral-blazor 1.0.0-pre.2296 → 1.0.1-beta.5640
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/LICENSE +1 -1
- package/README.md +51 -9
- package/convert.d.ts +13 -8
- package/convert.js +17 -12
- package/esm/converter.d.ts +10 -4
- package/esm/converter.js +164 -50
- package/esm/converter.js.map +1 -1
- package/esm/create.d.ts +21 -1
- package/esm/create.js +29 -15
- package/esm/create.js.map +1 -1
- package/esm/dependencies.d.ts +6 -3
- package/esm/dependencies.js +104 -14
- package/esm/dependencies.js.map +1 -1
- package/esm/events.d.ts +6 -0
- package/esm/events.js +145 -0
- package/esm/events.js.map +1 -0
- package/esm/interop.d.ts +29 -12
- package/esm/interop.js +181 -119
- package/esm/interop.js.map +1 -1
- package/esm/navigation.d.ts +2 -0
- package/esm/navigation.js +30 -0
- package/esm/navigation.js.map +1 -0
- package/esm/types.d.ts +97 -4
- package/infra.codegen +32 -23
- package/lib/converter.d.ts +10 -4
- package/lib/converter.js +164 -50
- package/lib/converter.js.map +1 -1
- package/lib/create.d.ts +21 -1
- package/lib/create.js +31 -17
- package/lib/create.js.map +1 -1
- package/lib/dependencies.d.ts +6 -3
- package/lib/dependencies.js +104 -14
- package/lib/dependencies.js.map +1 -1
- package/lib/events.d.ts +6 -0
- package/lib/events.js +154 -0
- package/lib/events.js.map +1 -0
- package/lib/index.js +1 -1
- package/lib/interop.d.ts +29 -12
- package/lib/interop.js +196 -124
- package/lib/interop.js.map +1 -1
- package/lib/navigation.d.ts +2 -0
- package/lib/navigation.js +35 -0
- package/lib/navigation.js.map +1 -0
- package/lib/types.d.ts +97 -4
- package/package.json +25 -9
- package/src/converter.ts +233 -63
- package/src/create.ts +53 -9
- package/src/dependencies.ts +122 -14
- package/src/events.ts +174 -0
- package/src/interop.ts +228 -117
- package/src/navigation.ts +36 -0
- package/src/types.ts +115 -4
- package/convert.ts +0 -17
|
@@ -0,0 +1,35 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.performInternalNavigation = exports.isInternalNavigation = void 0;
|
|
4
|
+
function findClosestAncestor(element, tagName) {
|
|
5
|
+
// tslint:disable-next-line:no-null-keyword
|
|
6
|
+
return !element ? null : element.tagName === tagName ? element : findClosestAncestor(element.parentElement, tagName);
|
|
7
|
+
}
|
|
8
|
+
function getAnchorTarget(event) {
|
|
9
|
+
return findClosestAncestor(event.target, 'A');
|
|
10
|
+
}
|
|
11
|
+
function isWithinBaseUriSpace(href) {
|
|
12
|
+
const baseURI = document.baseURI;
|
|
13
|
+
const baseUriUntilLastSlash = baseURI.substr(0, baseURI.lastIndexOf('/') + 1);
|
|
14
|
+
return href.startsWith(baseUriUntilLastSlash);
|
|
15
|
+
}
|
|
16
|
+
function eventHasSpecialKey(event) {
|
|
17
|
+
return event.ctrlKey || event.shiftKey || event.altKey || event.metaKey;
|
|
18
|
+
}
|
|
19
|
+
function isInternalNavigation(event) {
|
|
20
|
+
const anchorTarget = getAnchorTarget(event);
|
|
21
|
+
return (event.type === 'click' &&
|
|
22
|
+
event.button === 0 &&
|
|
23
|
+
!eventHasSpecialKey(event) &&
|
|
24
|
+
(anchorTarget === null || anchorTarget === void 0 ? void 0 : anchorTarget.hasAttribute('href')) &&
|
|
25
|
+
isWithinBaseUriSpace(anchorTarget.href));
|
|
26
|
+
}
|
|
27
|
+
exports.isInternalNavigation = isInternalNavigation;
|
|
28
|
+
function performInternalNavigation(event) {
|
|
29
|
+
const anchorTarget = getAnchorTarget(event);
|
|
30
|
+
event.preventDefault();
|
|
31
|
+
const to = anchorTarget.getAttribute('href');
|
|
32
|
+
window.Blazor.emitNavigateEvent(anchorTarget, to);
|
|
33
|
+
}
|
|
34
|
+
exports.performInternalNavigation = performInternalNavigation;
|
|
35
|
+
//# sourceMappingURL=navigation.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"navigation.js","sourceRoot":"","sources":["../src/navigation.ts"],"names":[],"mappings":";;;AAAA,SAAS,mBAAmB,CAAC,OAAuB,EAAE,OAAe;IACnE,2CAA2C;IAC3C,OAAO,CAAC,OAAO,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC,OAAO,CAAC,aAAa,EAAE,OAAO,CAAC,CAAC;AACvH,CAAC;AAED,SAAS,eAAe,CAAC,KAAiB;IACxC,OAAO,mBAAmB,CAAC,KAAK,CAAC,MAAwB,EAAE,GAAG,CAA6B,CAAC;AAC9F,CAAC;AAED,SAAS,oBAAoB,CAAC,IAAY;IACxC,MAAM,OAAO,GAAG,QAAQ,CAAC,OAAO,CAAC;IACjC,MAAM,qBAAqB,GAAG,OAAO,CAAC,MAAM,CAAC,CAAC,EAAE,OAAO,CAAC,WAAW,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC,CAAC;IAC9E,OAAO,IAAI,CAAC,UAAU,CAAC,qBAAqB,CAAC,CAAC;AAChD,CAAC;AAED,SAAS,kBAAkB,CAAC,KAAiB;IAC3C,OAAO,KAAK,CAAC,OAAO,IAAI,KAAK,CAAC,QAAQ,IAAI,KAAK,CAAC,MAAM,IAAI,KAAK,CAAC,OAAO,CAAC;AAC1E,CAAC;AAED,SAAgB,oBAAoB,CAAC,KAAiB;IACpD,MAAM,YAAY,GAAG,eAAe,CAAC,KAAK,CAAC,CAAC;IAC5C,OAAO,CACL,KAAK,CAAC,IAAI,KAAK,OAAO;QACtB,KAAK,CAAC,MAAM,KAAK,CAAC;QAClB,CAAC,kBAAkB,CAAC,KAAK,CAAC;SAC1B,YAAY,aAAZ,YAAY,uBAAZ,YAAY,CAAE,YAAY,CAAC,MAAM,CAAC,CAAA;QAClC,oBAAoB,CAAC,YAAY,CAAC,IAAI,CAAC,CACxC,CAAC;AACJ,CAAC;AATD,oDASC;AAED,SAAgB,yBAAyB,CAAC,KAAiB;IACzD,MAAM,YAAY,GAAG,eAAe,CAAC,KAAK,CAAC,CAAC;IAC5C,KAAK,CAAC,cAAc,EAAE,CAAC;IACvB,MAAM,EAAE,GAAG,YAAY,CAAC,YAAY,CAAC,MAAM,CAAC,CAAC;IAC7C,MAAM,CAAC,MAAM,CAAC,iBAAiB,CAAC,YAAY,EAAE,EAAE,CAAC,CAAC;AACpD,CAAC;AALD,8DAKC"}
|
package/lib/types.d.ts
CHANGED
|
@@ -1,4 +1,60 @@
|
|
|
1
|
-
import type { ForeignComponent } from 'piral-core';
|
|
1
|
+
import type { ForeignComponent, PiletApi } from 'piral-core';
|
|
2
|
+
export type BlazorRootConfig = [
|
|
3
|
+
root: HTMLDivElement,
|
|
4
|
+
capabilities: Array<string>,
|
|
5
|
+
applyChanges: (pilet: PiletApi) => void
|
|
6
|
+
];
|
|
7
|
+
export interface BlazorDependencyLoader {
|
|
8
|
+
(config: BlazorRootConfig): Promise<void>;
|
|
9
|
+
}
|
|
10
|
+
export type WebAssemblyBootResourceType = 'assembly' | 'pdb' | 'dotnetjs' | 'dotnetwasm' | 'globalization' | 'manifest';
|
|
11
|
+
export interface WebAssemblyStartOptions {
|
|
12
|
+
/**
|
|
13
|
+
* Overrides the built-in boot resource loading mechanism so that boot resources can be fetched
|
|
14
|
+
* from a custom source, such as an external CDN.
|
|
15
|
+
* @param type The type of the resource to be loaded.
|
|
16
|
+
* @param name The name of the resource to be loaded.
|
|
17
|
+
* @param defaultUri The URI from which the framework would fetch the resource by default. The URI may be relative or absolute.
|
|
18
|
+
* @param integrity The integrity string representing the expected content in the response.
|
|
19
|
+
* @returns A URI string or a Response promise to override the loading process, or null/undefined to allow the default loading behavior.
|
|
20
|
+
*/
|
|
21
|
+
loadBootResource?(type: WebAssemblyBootResourceType, name: string, defaultUri: string, integrity: string): string | Promise<Response> | null | undefined;
|
|
22
|
+
/**
|
|
23
|
+
* Override built-in environment setting on start.
|
|
24
|
+
*/
|
|
25
|
+
environment?: string;
|
|
26
|
+
/**
|
|
27
|
+
* Gets the application culture. This is a name specified in the BCP 47 format. See https://tools.ietf.org/html/bcp47
|
|
28
|
+
*/
|
|
29
|
+
applicationCulture?: string;
|
|
30
|
+
}
|
|
31
|
+
declare global {
|
|
32
|
+
interface Window {
|
|
33
|
+
Blazor: {
|
|
34
|
+
start(options?: Partial<WebAssemblyStartOptions>): Promise<void>;
|
|
35
|
+
emitPiralEvent(type: string, args: any): void;
|
|
36
|
+
emitRenderEvent(source: HTMLElement, name: string, params: any, sourceRef: any, fallbackComponent: string | null): void;
|
|
37
|
+
emitNavigateEvent(target: Element, path: string, replace?: boolean, state?: any): void;
|
|
38
|
+
_internal: {
|
|
39
|
+
navigationManager: any;
|
|
40
|
+
applyHotReload: any;
|
|
41
|
+
NavigationLock: any;
|
|
42
|
+
};
|
|
43
|
+
};
|
|
44
|
+
DotNet: any;
|
|
45
|
+
$blazorLoader: Promise<BlazorRootConfig>;
|
|
46
|
+
$blazorDependencyPrios: Array<{
|
|
47
|
+
prio: number;
|
|
48
|
+
load(): Promise<void>;
|
|
49
|
+
}>;
|
|
50
|
+
$blazorDependencies: Array<{
|
|
51
|
+
name: string;
|
|
52
|
+
url: string;
|
|
53
|
+
count: number;
|
|
54
|
+
promise: Promise<void>;
|
|
55
|
+
}>;
|
|
56
|
+
}
|
|
57
|
+
}
|
|
2
58
|
declare module 'piral-core/lib/types/custom' {
|
|
3
59
|
interface PiletCustomApi extends PiletBlazorApi {
|
|
4
60
|
}
|
|
@@ -6,6 +62,24 @@ declare module 'piral-core/lib/types/custom' {
|
|
|
6
62
|
blazor(component: BlazorComponent): ForeignComponent<TProps>;
|
|
7
63
|
}
|
|
8
64
|
}
|
|
65
|
+
export declare const enum BlazorLogLevel {
|
|
66
|
+
trace = 0,
|
|
67
|
+
debug = 1,
|
|
68
|
+
info = 2,
|
|
69
|
+
warn = 3,
|
|
70
|
+
error = 4,
|
|
71
|
+
critical = 5,
|
|
72
|
+
none = 6
|
|
73
|
+
}
|
|
74
|
+
/**
|
|
75
|
+
* Additional options for the Blazor component
|
|
76
|
+
*/
|
|
77
|
+
export interface BlazorOptions {
|
|
78
|
+
/**
|
|
79
|
+
* The root path where resources are located.
|
|
80
|
+
*/
|
|
81
|
+
resourcePathRoot?: string;
|
|
82
|
+
}
|
|
9
83
|
export interface BlazorComponent {
|
|
10
84
|
/**
|
|
11
85
|
* The name of the Blazor module to render.
|
|
@@ -19,26 +93,45 @@ export interface BlazorComponent {
|
|
|
19
93
|
* An optional dependency that needs to load before
|
|
20
94
|
* the component can be properly displayed.
|
|
21
95
|
*/
|
|
22
|
-
dependency?:
|
|
96
|
+
dependency?: BlazorDependencyLoader;
|
|
23
97
|
/**
|
|
24
98
|
* The type of the Blazor component.
|
|
25
99
|
*/
|
|
26
100
|
type: 'blazor';
|
|
101
|
+
/**
|
|
102
|
+
* Additional options for the Blazor component.
|
|
103
|
+
*/
|
|
104
|
+
options?: BlazorOptions;
|
|
27
105
|
}
|
|
28
106
|
/**
|
|
29
107
|
* Defines the provided set of Blazor Pilet API extensions.
|
|
30
108
|
*/
|
|
31
109
|
export interface PiletBlazorApi {
|
|
32
110
|
/**
|
|
33
|
-
* Defines the additional libraries to Blazor via
|
|
111
|
+
* Defines the additional libraries (and their symbols) to Blazor via
|
|
112
|
+
* their URLs.
|
|
113
|
+
*
|
|
34
114
|
* @param referenceUrls The URLs pointing to the different DLLs to include.
|
|
115
|
+
* @param satellites The URLs of the potential satellite DLLs to include.
|
|
116
|
+
* @param prio The loading priority of the DLLs. Higher numbers will always be loaded before lower numbers.
|
|
35
117
|
*/
|
|
36
|
-
defineBlazorReferences(referenceUrls: Array<string
|
|
118
|
+
defineBlazorReferences(referenceUrls: Array<string>, satellites?: Record<string, Array<string>>, prio?: number): void;
|
|
37
119
|
/**
|
|
38
120
|
* Wraps a Blazor module for use in Piral.
|
|
121
|
+
*
|
|
39
122
|
* @param moduleName The name of the exposed Blazor component.
|
|
40
123
|
* @param args The optional props to use as arguments for the Blazor component.
|
|
41
124
|
* @returns The Piral Blazor component.
|
|
42
125
|
*/
|
|
43
126
|
fromBlazor(moduleName: string, args?: Record<string, any>): BlazorComponent;
|
|
127
|
+
/**
|
|
128
|
+
* Defines the additional options to be shared by all Blazor components.
|
|
129
|
+
*
|
|
130
|
+
* @param options The options for the Blazor components.
|
|
131
|
+
*/
|
|
132
|
+
defineBlazorOptions(options: BlazorOptions): void;
|
|
133
|
+
/**
|
|
134
|
+
* Releases all defined blazor references from the current pilet.
|
|
135
|
+
*/
|
|
136
|
+
releaseBlazorReferences(): void;
|
|
44
137
|
}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "piral-blazor",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.1-beta.5640",
|
|
4
4
|
"description": "Plugin for integrating Blazor components in Piral.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"piral",
|
|
@@ -21,6 +21,26 @@
|
|
|
21
21
|
"module": "esm/index.js",
|
|
22
22
|
"main": "lib/index.js",
|
|
23
23
|
"typings": "lib/index.d.ts",
|
|
24
|
+
"exports": {
|
|
25
|
+
".": {
|
|
26
|
+
"import": "./esm/index.js",
|
|
27
|
+
"require": "./lib/index.js"
|
|
28
|
+
},
|
|
29
|
+
"./convert": {
|
|
30
|
+
"import": "./convert.js"
|
|
31
|
+
},
|
|
32
|
+
"./esm/*": {
|
|
33
|
+
"import": "./esm/*"
|
|
34
|
+
},
|
|
35
|
+
"./lib/*": {
|
|
36
|
+
"require": "./lib/*"
|
|
37
|
+
},
|
|
38
|
+
"./_/*": {
|
|
39
|
+
"import": "./esm/*.js",
|
|
40
|
+
"require": "./lib/*.js"
|
|
41
|
+
},
|
|
42
|
+
"./package.json": "./package.json"
|
|
43
|
+
},
|
|
24
44
|
"sideEffects": false,
|
|
25
45
|
"files": [
|
|
26
46
|
"infra.codegen",
|
|
@@ -28,7 +48,6 @@
|
|
|
28
48
|
"lib",
|
|
29
49
|
"src",
|
|
30
50
|
"convert.d.ts",
|
|
31
|
-
"convert.ts",
|
|
32
51
|
"convert.js"
|
|
33
52
|
],
|
|
34
53
|
"repository": {
|
|
@@ -39,19 +58,16 @@
|
|
|
39
58
|
"url": "https://github.com/smapiot/piral/issues"
|
|
40
59
|
},
|
|
41
60
|
"scripts": {
|
|
61
|
+
"cleanup": "rimraf esm lib convert.d.ts convert.js",
|
|
42
62
|
"build": "yarn build:commonjs && yarn build:esnext && yarn build:convert",
|
|
43
|
-
"build:convert": "tsc convert.ts --skipLibCheck --declaration",
|
|
63
|
+
"build:convert": "tsc convert.ts --skipLibCheck --declaration --module esnext",
|
|
44
64
|
"build:commonjs": "tsc --project tsconfig.json --outDir lib --module commonjs",
|
|
45
65
|
"build:esnext": "tsc --project tsconfig.json --outDir esm --module esnext",
|
|
46
66
|
"typedoc": "typedoc --json ../../../docs/types/piral-blazor.json src --exclude \"src/**/*.test.*\"",
|
|
47
67
|
"test": "echo \"Error: run tests from root\" && exit 1"
|
|
48
68
|
},
|
|
49
69
|
"devDependencies": {
|
|
50
|
-
"piral-core": "
|
|
51
|
-
},
|
|
52
|
-
"peerDependencies": {
|
|
53
|
-
"blazor": "*",
|
|
54
|
-
"piral-core": "0.13.x"
|
|
70
|
+
"piral-core": "1.0.1-beta.5640"
|
|
55
71
|
},
|
|
56
|
-
"gitHead": "
|
|
72
|
+
"gitHead": "fa0a72b28fd0a20afec7ef491ec19e93c090fc72"
|
|
57
73
|
}
|
package/src/converter.ts
CHANGED
|
@@ -1,78 +1,248 @@
|
|
|
1
|
-
import type {
|
|
1
|
+
import type { BaseComponentProps, Disposable, ForeignComponent } from 'piral-core';
|
|
2
|
+
import { addGlobalEventListeners, attachEvents, removeGlobalEventListeners } from './events';
|
|
2
3
|
import {
|
|
3
|
-
initialize,
|
|
4
4
|
activate,
|
|
5
5
|
deactivate,
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
6
|
+
createBootLoader,
|
|
7
|
+
reactivate,
|
|
8
|
+
callNotifyLocationChanged,
|
|
9
|
+
setLanguage,
|
|
10
|
+
createElement,
|
|
11
|
+
destroyElement,
|
|
12
|
+
updateElement,
|
|
13
|
+
setLogLevel,
|
|
14
|
+
processEvent,
|
|
9
15
|
} from './interop';
|
|
16
|
+
import {
|
|
17
|
+
BlazorDependencyLoader,
|
|
18
|
+
BlazorLogLevel,
|
|
19
|
+
BlazorOptions,
|
|
20
|
+
BlazorRootConfig,
|
|
21
|
+
WebAssemblyStartOptions,
|
|
22
|
+
} from './types';
|
|
23
|
+
import bootConfig from '../infra.codegen';
|
|
10
24
|
|
|
11
|
-
|
|
12
|
-
const bootConfig = require('../infra.codegen');
|
|
13
|
-
const boot = () => initialize(bootConfig);
|
|
14
|
-
const root = document.body.appendChild(document.createElement('div'));
|
|
15
|
-
let loader = !lazy && boot();
|
|
25
|
+
const noop = () => {};
|
|
16
26
|
|
|
17
|
-
|
|
18
|
-
|
|
27
|
+
const mediaRules = [
|
|
28
|
+
{ attribute: 'src', selector: 'img, embed, video > source, video > track, audio > source' },
|
|
29
|
+
{ attribute: 'srcset', selector: 'picture > source' },
|
|
30
|
+
];
|
|
19
31
|
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
32
|
+
function prefixMediaSources(component: Element, prefix: string) {
|
|
33
|
+
const prefixAttributeValue = (el: Element, attr: string) => el.setAttribute(attr, prefix + el.getAttribute(attr));
|
|
34
|
+
|
|
35
|
+
for (const { attribute, selector } of mediaRules) {
|
|
36
|
+
Array.from(component.querySelectorAll(selector))
|
|
37
|
+
.filter((el) => el.hasAttribute(attribute) && !el.getAttribute(attribute).match(/^https?:/))
|
|
38
|
+
.forEach((el) => prefixAttributeValue(el, attribute));
|
|
39
|
+
}
|
|
40
|
+
}
|
|
41
|
+
|
|
42
|
+
function project(component: Element, destination: Element, options: BlazorOptions) {
|
|
43
|
+
if (options?.resourcePathRoot && !bootConfig.noMutation) {
|
|
44
|
+
prefixMediaSources(component, options.resourcePathRoot);
|
|
45
|
+
}
|
|
46
|
+
|
|
47
|
+
destination.appendChild(component);
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
function makeUrl(href: string) {
|
|
51
|
+
const origin = document.location.origin;
|
|
52
|
+
|
|
53
|
+
if (!href.startsWith(origin)) {
|
|
54
|
+
return `${origin}${href}`;
|
|
55
|
+
}
|
|
56
|
+
|
|
57
|
+
return href;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
interface BlazorLocals {
|
|
61
|
+
unmount?(): void;
|
|
62
|
+
update?(props: any): void;
|
|
63
|
+
dispose(): void;
|
|
64
|
+
next(config: BlazorRootConfig): void;
|
|
65
|
+
state: 'fresh' | 'mounted' | 'removed';
|
|
66
|
+
}
|
|
67
|
+
|
|
68
|
+
export interface LanguageOptions {
|
|
69
|
+
current: string | undefined;
|
|
70
|
+
onChange(inform: (language: string) => void): void;
|
|
71
|
+
}
|
|
72
|
+
|
|
73
|
+
export function createConverter(
|
|
74
|
+
lazy: boolean,
|
|
75
|
+
opts?: WebAssemblyStartOptions,
|
|
76
|
+
language?: LanguageOptions,
|
|
77
|
+
logLevel?: BlazorLogLevel,
|
|
78
|
+
) {
|
|
79
|
+
const bootLoader = createBootLoader(bootConfig.url, bootConfig.satellites);
|
|
80
|
+
const boot = (opts?: WebAssemblyStartOptions) =>
|
|
81
|
+
bootLoader(opts).then(async (res) => {
|
|
82
|
+
const [_, capabilities] = res;
|
|
83
|
+
|
|
84
|
+
if (capabilities.includes('logging')) {
|
|
85
|
+
if (typeof logLevel === 'number') {
|
|
86
|
+
await setLogLevel(logLevel);
|
|
87
|
+
}
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
if (language && capabilities.includes('language')) {
|
|
91
|
+
if (typeof language.current === 'string') {
|
|
92
|
+
await setLanguage(language.current);
|
|
93
|
+
}
|
|
94
|
+
|
|
95
|
+
if (capabilities.includes('events')) {
|
|
96
|
+
const eventDispatcher = document.body.dispatchEvent;
|
|
97
|
+
|
|
98
|
+
// listen to all events for forwarding them
|
|
99
|
+
document.body.dispatchEvent = function (ev: CustomEvent) {
|
|
100
|
+
if (ev.type.startsWith('piral-')) {
|
|
101
|
+
const type = ev.type.replace('piral-', '');
|
|
102
|
+
const args = ev.detail.arg;
|
|
103
|
+
processEvent(type, args);
|
|
47
104
|
}
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
? ctx.router.history.replace(ev.detail.to, ev.detail.store)
|
|
56
|
-
: ctx.router.history.push(ev.detail.to, ev.detail.state),
|
|
57
|
-
);
|
|
58
|
-
state = 'fresh';
|
|
59
|
-
},
|
|
60
|
-
unmount(el) {
|
|
61
|
-
removeGlobalEventListeners(el);
|
|
62
|
-
el.removeAttribute('data-blazor-pilet-root');
|
|
63
|
-
dispose();
|
|
64
|
-
|
|
65
|
-
if (state === 'mounted') {
|
|
66
|
-
root.querySelector(`#${id}`).appendChild(node);
|
|
67
|
-
deactivate(moduleName, referenceId);
|
|
105
|
+
|
|
106
|
+
return eventDispatcher.call(this, ev);
|
|
107
|
+
};
|
|
108
|
+
}
|
|
109
|
+
|
|
110
|
+
if (typeof language.onChange === 'function') {
|
|
111
|
+
language.onChange(setLanguage);
|
|
68
112
|
}
|
|
113
|
+
}
|
|
114
|
+
|
|
115
|
+
window.dispatchEvent(new CustomEvent('loaded-blazor-core'));
|
|
116
|
+
return res;
|
|
117
|
+
});
|
|
118
|
+
let loader = !lazy && boot(opts);
|
|
119
|
+
let listener: Disposable = undefined;
|
|
69
120
|
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
}
|
|
121
|
+
const enqueueChange = (locals: BlazorLocals, update: (root: BlazorRootConfig) => void) => {
|
|
122
|
+
if (typeof update !== 'function') {
|
|
123
|
+
// nothing to do in this case
|
|
124
|
+
} else if (locals.state === 'mounted') {
|
|
125
|
+
loader.then(update);
|
|
126
|
+
} else {
|
|
127
|
+
locals.next = update;
|
|
128
|
+
}
|
|
74
129
|
};
|
|
75
130
|
|
|
131
|
+
const convert = <TProps extends BaseComponentProps>(
|
|
132
|
+
moduleName: string,
|
|
133
|
+
dependency: BlazorDependencyLoader,
|
|
134
|
+
args: Record<string, any>,
|
|
135
|
+
options?: BlazorOptions,
|
|
136
|
+
): ForeignComponent<TProps> => ({
|
|
137
|
+
mount(el, data, ctx, locals: BlazorLocals) {
|
|
138
|
+
const props = { ...args, ...data };
|
|
139
|
+
const { piral } = data;
|
|
140
|
+
const nav = ctx.navigation;
|
|
141
|
+
el.setAttribute('data-blazor-pilet-root', 'true');
|
|
142
|
+
|
|
143
|
+
addGlobalEventListeners(el);
|
|
144
|
+
|
|
145
|
+
if (listener === undefined) {
|
|
146
|
+
listener = nav.listen(({ location, action }) => {
|
|
147
|
+
// POP is already handled by .NET
|
|
148
|
+
if (action !== 'POP') {
|
|
149
|
+
const url = makeUrl(location.href);
|
|
150
|
+
callNotifyLocationChanged(url, action === 'REPLACE', location.state);
|
|
151
|
+
}
|
|
152
|
+
});
|
|
153
|
+
}
|
|
154
|
+
|
|
155
|
+
locals.state = 'fresh';
|
|
156
|
+
locals.next = noop;
|
|
157
|
+
locals.dispose = attachEvents(
|
|
158
|
+
el,
|
|
159
|
+
(ev) => {
|
|
160
|
+
ev.stopPropagation();
|
|
161
|
+
const { target, props } = ev.detail;
|
|
162
|
+
piral.renderHtmlExtension(target, props);
|
|
163
|
+
},
|
|
164
|
+
(ev) => {
|
|
165
|
+
ev.stopPropagation();
|
|
166
|
+
const { to, state, replace } = ev.detail;
|
|
167
|
+
replace ? nav.replace(to, state) : nav.push(to, state);
|
|
168
|
+
},
|
|
169
|
+
(ev) => {
|
|
170
|
+
ev.stopPropagation();
|
|
171
|
+
const { type, args } = ev.detail;
|
|
172
|
+
piral.emit(type, args);
|
|
173
|
+
},
|
|
174
|
+
);
|
|
175
|
+
|
|
176
|
+
function mountClassic(config: BlazorRootConfig) {
|
|
177
|
+
return activate(moduleName, props).then((refId) => {
|
|
178
|
+
const [root] = config;
|
|
179
|
+
const node = root.querySelector(`#${refId} > div`);
|
|
180
|
+
|
|
181
|
+
locals.unmount = () => {
|
|
182
|
+
root.querySelector(`#${refId}`)?.appendChild(node);
|
|
183
|
+
deactivate(moduleName, refId);
|
|
184
|
+
el.innerHTML = '';
|
|
185
|
+
};
|
|
186
|
+
|
|
187
|
+
locals.update = (props) => {
|
|
188
|
+
reactivate(moduleName, refId, props);
|
|
189
|
+
};
|
|
190
|
+
|
|
191
|
+
project(node, el, options);
|
|
192
|
+
});
|
|
193
|
+
}
|
|
194
|
+
|
|
195
|
+
function mountModern(_: BlazorRootConfig) {
|
|
196
|
+
return createElement(moduleName, props).then((refId) => {
|
|
197
|
+
const child = document.createElement('piral-blazor-component');
|
|
198
|
+
child.setAttribute('rid', refId);
|
|
199
|
+
el.appendChild(child);
|
|
200
|
+
|
|
201
|
+
locals.unmount = () => {
|
|
202
|
+
destroyElement(refId);
|
|
203
|
+
child.remove();
|
|
204
|
+
el.innerHTML = '';
|
|
205
|
+
};
|
|
206
|
+
|
|
207
|
+
locals.update = (props) => {
|
|
208
|
+
updateElement(refId, props);
|
|
209
|
+
};
|
|
210
|
+
});
|
|
211
|
+
}
|
|
212
|
+
|
|
213
|
+
(loader || (convert.loader = loader = boot(opts)))
|
|
214
|
+
.then((config) =>
|
|
215
|
+
dependency(config).then(() => {
|
|
216
|
+
if (locals.state === 'fresh') {
|
|
217
|
+
const [_, capabilities, applyChanges] = config;
|
|
218
|
+
const fn = capabilities.includes('custom-element') ? mountModern : mountClassic;
|
|
219
|
+
applyChanges(piral);
|
|
220
|
+
|
|
221
|
+
return fn(config).then(() => {
|
|
222
|
+
locals.state = 'mounted';
|
|
223
|
+
locals.next(config);
|
|
224
|
+
locals.next = noop;
|
|
225
|
+
});
|
|
226
|
+
}
|
|
227
|
+
}),
|
|
228
|
+
)
|
|
229
|
+
.catch((err) => console.error(err));
|
|
230
|
+
},
|
|
231
|
+
update(el, data, ctx, locals: BlazorLocals) {
|
|
232
|
+
enqueueChange(locals, () => {
|
|
233
|
+
locals.update?.({ ...args, ...data });
|
|
234
|
+
});
|
|
235
|
+
},
|
|
236
|
+
unmount(el, locals: BlazorLocals) {
|
|
237
|
+
removeGlobalEventListeners(el);
|
|
238
|
+
el.removeAttribute('data-blazor-pilet-root');
|
|
239
|
+
locals.dispose();
|
|
240
|
+
enqueueChange(locals, locals.unmount);
|
|
241
|
+
locals.state = 'removed';
|
|
242
|
+
},
|
|
243
|
+
});
|
|
244
|
+
|
|
76
245
|
convert.loader = loader;
|
|
246
|
+
convert.lazy = lazy;
|
|
77
247
|
return convert;
|
|
78
248
|
}
|
package/src/create.ts
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import type { PiralPlugin } from 'piral-core';
|
|
1
|
+
import type { EventEmitter, PiralPlugin } from 'piral-core';
|
|
2
2
|
import { createConverter } from './converter';
|
|
3
3
|
import { createDependencyLoader } from './dependencies';
|
|
4
|
-
import type { PiletBlazorApi } from './types';
|
|
4
|
+
import type { BlazorLogLevel, BlazorOptions, PiletBlazorApi, WebAssemblyStartOptions } from './types';
|
|
5
5
|
|
|
6
6
|
/**
|
|
7
7
|
* Available configuration options for the Blazor plugin.
|
|
@@ -12,29 +12,73 @@ export interface BlazorConfig {
|
|
|
12
12
|
* @default true
|
|
13
13
|
*/
|
|
14
14
|
lazy?: boolean;
|
|
15
|
+
/**
|
|
16
|
+
* Determines the used log level, if any. Otherwise, will use
|
|
17
|
+
* the default log level (info).
|
|
18
|
+
*/
|
|
19
|
+
logLevel?: BlazorLogLevel;
|
|
20
|
+
/**
|
|
21
|
+
* Determines the initial language to use, if any.
|
|
22
|
+
* Otherwise, falls back to Blazor's default language.
|
|
23
|
+
*/
|
|
24
|
+
initialLanguage?: string;
|
|
25
|
+
/**
|
|
26
|
+
* Installs a function to handle language change. By default,
|
|
27
|
+
* this will hook on to the `select-language` event from Piral.
|
|
28
|
+
* @param inform The callback to use for passing in a new locale.
|
|
29
|
+
*/
|
|
30
|
+
onLanguageChange?: ((inform: (language: string) => void) => void) | false;
|
|
31
|
+
/**
|
|
32
|
+
* Determines the start options to use for booting Blazor.
|
|
33
|
+
*/
|
|
34
|
+
options?: WebAssemblyStartOptions;
|
|
35
|
+
}
|
|
36
|
+
|
|
37
|
+
function createDefaultHandler(context: EventEmitter) {
|
|
38
|
+
return (inform: (language: string) => void) => {
|
|
39
|
+
context.on('select-language', (ev) => {
|
|
40
|
+
inform(ev.currentLanguage);
|
|
41
|
+
});
|
|
42
|
+
};
|
|
15
43
|
}
|
|
16
44
|
|
|
17
45
|
/**
|
|
18
46
|
* Creates new Pilet API extensions for integration of Blazor.
|
|
19
47
|
*/
|
|
20
48
|
export function createBlazorApi(config: BlazorConfig = {}): PiralPlugin<PiletBlazorApi> {
|
|
21
|
-
const { lazy } = config;
|
|
22
|
-
|
|
23
49
|
return (context) => {
|
|
24
|
-
const
|
|
25
|
-
|
|
50
|
+
const { lazy = true, initialLanguage, onLanguageChange = createDefaultHandler(context), logLevel } = config;
|
|
51
|
+
const convert = createConverter(
|
|
52
|
+
lazy,
|
|
53
|
+
config.options,
|
|
54
|
+
{
|
|
55
|
+
current: initialLanguage,
|
|
56
|
+
onChange: onLanguageChange || (() => {}),
|
|
57
|
+
},
|
|
58
|
+
logLevel,
|
|
59
|
+
);
|
|
60
|
+
context.converters.blazor = ({ moduleName, args, dependency, options }) =>
|
|
61
|
+
convert(moduleName, dependency, args, options);
|
|
26
62
|
|
|
27
|
-
return () => {
|
|
28
|
-
const loader = createDependencyLoader(convert
|
|
63
|
+
return (_, meta) => {
|
|
64
|
+
const loader = createDependencyLoader(convert);
|
|
65
|
+
let options: BlazorOptions;
|
|
29
66
|
|
|
30
67
|
return {
|
|
31
|
-
defineBlazorReferences
|
|
68
|
+
defineBlazorReferences(references, satellites, prio) {
|
|
69
|
+
return loader.defineBlazorReferences(references, meta, satellites, prio);
|
|
70
|
+
},
|
|
71
|
+
defineBlazorOptions(blazorOptions: BlazorOptions) {
|
|
72
|
+
options = blazorOptions;
|
|
73
|
+
},
|
|
74
|
+
releaseBlazorReferences: loader.releaseBlazorReferences,
|
|
32
75
|
fromBlazor(moduleName, args) {
|
|
33
76
|
return {
|
|
34
77
|
type: 'blazor',
|
|
35
78
|
dependency: loader.getDependency(),
|
|
36
79
|
moduleName,
|
|
37
80
|
args,
|
|
81
|
+
options,
|
|
38
82
|
};
|
|
39
83
|
},
|
|
40
84
|
};
|