piral-core 0.14.8-beta.3509 → 0.14.8-beta.3515
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/esm/Piral.js +2 -0
- package/esm/Piral.js.map +1 -1
- package/esm/RootListener.d.ts +2 -0
- package/esm/RootListener.js +23 -0
- package/esm/RootListener.js.map +1 -0
- package/esm/components/ExtensionSlot.js +2 -2
- package/esm/components/ExtensionSlot.js.map +1 -1
- package/esm/modules/api.d.ts +3 -4
- package/esm/modules/api.js +1 -134
- package/esm/modules/api.js.map +1 -1
- package/esm/modules/core.d.ts +3 -0
- package/esm/modules/core.js +48 -0
- package/esm/modules/core.js.map +1 -0
- package/esm/modules/element.d.ts +5 -0
- package/esm/modules/element.js +83 -0
- package/esm/modules/element.js.map +1 -0
- package/esm/modules/index.d.ts +1 -0
- package/esm/modules/index.js +1 -0
- package/esm/modules/index.js.map +1 -1
- package/esm/types/extension.d.ts +7 -3
- package/esm/utils/extension.d.ts +13 -0
- package/esm/utils/extension.js +32 -0
- package/esm/utils/extension.js.map +1 -1
- package/lib/Piral.js +2 -0
- package/lib/Piral.js.map +1 -1
- package/lib/RootListener.d.ts +2 -0
- package/lib/RootListener.js +27 -0
- package/lib/RootListener.js.map +1 -0
- package/lib/components/ExtensionSlot.js +2 -2
- package/lib/components/ExtensionSlot.js.map +1 -1
- package/lib/modules/api.d.ts +3 -4
- package/lib/modules/api.js +3 -137
- package/lib/modules/api.js.map +1 -1
- package/lib/modules/core.d.ts +3 -0
- package/lib/modules/core.js +52 -0
- package/lib/modules/core.js.map +1 -0
- package/lib/modules/element.d.ts +5 -0
- package/lib/modules/element.js +87 -0
- package/lib/modules/element.js.map +1 -0
- package/lib/modules/index.d.ts +1 -0
- package/lib/modules/index.js +1 -0
- package/lib/modules/index.js.map +1 -1
- package/lib/types/extension.d.ts +7 -3
- package/lib/utils/extension.d.ts +13 -0
- package/lib/utils/extension.js +34 -1
- package/lib/utils/extension.js.map +1 -1
- package/package.json +4 -4
- package/src/Piral.tsx +2 -0
- package/src/RootListener.tsx +26 -0
- package/src/components/ExtensionSlot.tsx +2 -1
- package/src/modules/api.test.ts +15 -15
- package/src/modules/api.ts +3 -158
- package/src/modules/core.test.ts +148 -0
- package/src/modules/core.ts +50 -0
- package/src/modules/element.ts +103 -0
- package/src/modules/index.ts +1 -0
- package/src/types/extension.ts +7 -2
- package/src/utils/extension.tsx +41 -0
package/esm/Piral.js
CHANGED
|
@@ -2,6 +2,7 @@ import * as React from 'react';
|
|
|
2
2
|
import { StateContext } from './state';
|
|
3
3
|
import { createInstance } from './createInstance';
|
|
4
4
|
import { PiralView, Mediator, ResponsiveLayout, PortalRenderer } from './components';
|
|
5
|
+
import { RootListener } from './RootListener';
|
|
5
6
|
/**
|
|
6
7
|
* Represents the Piral app shell frame. Use this component together
|
|
7
8
|
* with an existing instance to render the app shell.
|
|
@@ -20,6 +21,7 @@ const app = (
|
|
|
20
21
|
export const Piral = ({ instance = createInstance(), breakpoints, children }) => (React.createElement(StateContext.Provider, { value: instance.context },
|
|
21
22
|
React.createElement(ResponsiveLayout, { breakpoints: breakpoints }),
|
|
22
23
|
React.createElement(Mediator, { options: instance.options, key: instance.id }),
|
|
24
|
+
React.createElement(RootListener, null),
|
|
23
25
|
React.createElement(PiralView, null,
|
|
24
26
|
React.createElement(PortalRenderer, { id: "root" }),
|
|
25
27
|
children)));
|
package/esm/Piral.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Piral.js","sourceRoot":"","sources":["../src/Piral.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;
|
|
1
|
+
{"version":3,"file":"Piral.js","sourceRoot":"","sources":["../src/Piral.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AACvC,OAAO,EAAE,cAAc,EAAE,MAAM,kBAAkB,CAAC;AAClD,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,gBAAgB,EAAE,cAAc,EAAE,MAAM,cAAc,CAAC;AACrF,OAAO,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAG9C;;;;;;;;;;;;;;GAcG;AACH,MAAM,CAAC,MAAM,KAAK,GAAyB,CAAC,EAAE,QAAQ,GAAG,cAAc,EAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CACrG,oBAAC,YAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,QAAQ,CAAC,OAAO;IAC5C,oBAAC,gBAAgB,IAAC,WAAW,EAAE,WAAW,GAAI;IAC9C,oBAAC,QAAQ,IAAC,OAAO,EAAE,QAAQ,CAAC,OAAO,EAAE,GAAG,EAAE,QAAQ,CAAC,EAAE,GAAI;IACzD,oBAAC,YAAY,OAAG;IAChB,oBAAC,SAAS;QACR,oBAAC,cAAc,IAAC,EAAE,EAAC,MAAM,GAAG;QAC3B,QAAQ,CACC,CACU,CACzB,CAAC;AACF,KAAK,CAAC,WAAW,GAAG,OAAO,CAAC"}
|
|
@@ -0,0 +1,23 @@
|
|
|
1
|
+
import * as React from 'react';
|
|
2
|
+
import { useGlobalStateContext } from '.';
|
|
3
|
+
import { renderElement } from './modules';
|
|
4
|
+
export const RootListener = () => {
|
|
5
|
+
const context = useGlobalStateContext();
|
|
6
|
+
React.useLayoutEffect(() => {
|
|
7
|
+
if (typeof document !== 'undefined') {
|
|
8
|
+
const handler = (ev) => {
|
|
9
|
+
ev.stopPropagation();
|
|
10
|
+
const { target, props } = ev.detail;
|
|
11
|
+
const [dispose, update] = renderElement(context, target, props);
|
|
12
|
+
target.dispose = dispose;
|
|
13
|
+
target.update = update;
|
|
14
|
+
};
|
|
15
|
+
document.body.addEventListener('render-html', handler, false);
|
|
16
|
+
return () => {
|
|
17
|
+
document.body.removeEventListener('render-html', handler, false);
|
|
18
|
+
};
|
|
19
|
+
}
|
|
20
|
+
}, [context]);
|
|
21
|
+
return null;
|
|
22
|
+
};
|
|
23
|
+
//# sourceMappingURL=RootListener.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RootListener.js","sourceRoot":"","sources":["../src/RootListener.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,qBAAqB,EAAE,MAAM,GAAG,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAE1C,MAAM,CAAC,MAAM,YAAY,GAAa,GAAG,EAAE;IACzC,MAAM,OAAO,GAAG,qBAAqB,EAAE,CAAC;IAExC,KAAK,CAAC,eAAe,CAAC,GAAG,EAAE;QACzB,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE;YACnC,MAAM,OAAO,GAAG,CAAC,EAAe,EAAE,EAAE;gBAClC,EAAE,CAAC,eAAe,EAAE,CAAC;gBACrB,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC;gBACpC,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,GAAG,aAAa,CAAC,OAAO,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;gBAChE,MAAM,CAAC,OAAO,GAAG,OAAO,CAAC;gBACzB,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC;YACzB,CAAC,CAAC;YACF,QAAQ,CAAC,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;YAE9D,OAAO,GAAG,EAAE;gBACV,QAAQ,CAAC,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;YACnE,CAAC,CAAC;SACH;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,IAAI,CAAC;AACd,CAAC,CAAC"}
|
|
@@ -8,11 +8,11 @@ import { defaultRender, none } from '../utils';
|
|
|
8
8
|
* location.
|
|
9
9
|
*/
|
|
10
10
|
export function ExtensionSlot(props) {
|
|
11
|
-
const { name, render = defaultRender, empty, params } = props;
|
|
11
|
+
const { name, render = defaultRender, empty, params, children } = props;
|
|
12
12
|
const extensions = useGlobalState((s) => s.registry.extensions[name] || none);
|
|
13
13
|
return render(extensions.length === 0 && isfunc(empty)
|
|
14
14
|
? [defaultRender(empty(), 'empty')]
|
|
15
|
-
: extensions.map(({ component: Component, reference, defaults = {} }, i) => (React.createElement(Component, { key: `${(reference === null || reference === void 0 ? void 0 : reference.displayName) || '_'}${i}`, params: Object.assign(Object.assign({}, defaults), (params || {})) }))));
|
|
15
|
+
: extensions.map(({ component: Component, reference, defaults = {} }, i) => (React.createElement(Component, { key: `${(reference === null || reference === void 0 ? void 0 : reference.displayName) || '_'}${i}`, children: children, params: Object.assign(Object.assign({}, defaults), (params || {})) }))));
|
|
16
16
|
}
|
|
17
17
|
ExtensionSlot.displayName = `ExtensionSlot`;
|
|
18
18
|
//# sourceMappingURL=ExtensionSlot.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExtensionSlot.js","sourceRoot":"","sources":["../../src/components/ExtensionSlot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAG/C;;;;GAIG;AACH,MAAM,UAAU,aAAa,CAAmB,KAA4B;IAC1E,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,aAAa,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"ExtensionSlot.js","sourceRoot":"","sources":["../../src/components/ExtensionSlot.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AACpC,OAAO,EAAE,cAAc,EAAE,MAAM,UAAU,CAAC;AAC1C,OAAO,EAAE,aAAa,EAAE,IAAI,EAAE,MAAM,UAAU,CAAC;AAG/C;;;;GAIG;AACH,MAAM,UAAU,aAAa,CAAmB,KAA4B;IAC1E,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,aAAa,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IACxE,MAAM,UAAU,GAAG,cAAc,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,CAAC;IAC9E,OAAO,MAAM,CACX,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,MAAM,CAAC,KAAK,CAAC;QACtC,CAAC,CAAC,CAAC,aAAa,CAAC,KAAK,EAAE,EAAE,OAAO,CAAC,CAAC;QACnC,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CACxE,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,WAAW,KAAI,GAAG,GAAG,CAAC,EAAE,EAC3C,QAAQ,EAAE,QAAQ,EAClB,MAAM,kCACD,QAAQ,GACR,CAAC,MAAM,IAAI,EAAE,CAAC,IAEnB,CACH,CAAC,CACP,CAAC;AACJ,CAAC;AAED,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC"}
|
package/esm/modules/api.d.ts
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import { PiletApiCreator
|
|
2
|
-
import { GlobalStateContext,
|
|
3
|
-
export declare function
|
|
4
|
-
export declare function createExtenders(context: GlobalStateContext, apis: Array<PiralPlugin>): PiletApiExtender<Partial<import("piral-base").PiletApi>>[];
|
|
1
|
+
import { PiletApiCreator } from 'piral-base';
|
|
2
|
+
import { GlobalStateContext, PiralPlugin } from '../types';
|
|
3
|
+
export declare function createExtenders(context: GlobalStateContext, apis: Array<PiralPlugin>): import("piral-base").PiletApiExtender<Partial<import("piral-base").PiletApi>>[];
|
|
5
4
|
export declare function defaultApiFactory(context: GlobalStateContext, apis: Array<PiralPlugin>): PiletApiCreator;
|
package/esm/modules/api.js
CHANGED
|
@@ -1,138 +1,5 @@
|
|
|
1
1
|
import { isfunc, initializeApi, mergeApis } from 'piral-base';
|
|
2
|
-
import {
|
|
3
|
-
import { ExtensionSlot } from '../components';
|
|
4
|
-
import { createDataOptions, getDataExpiration, renderInDom, tryParseJson, changeDomPortal, noop } from '../utils';
|
|
5
|
-
if (typeof window !== 'undefined' && 'customElements' in window) {
|
|
6
|
-
class PiralExtension extends HTMLElement {
|
|
7
|
-
constructor() {
|
|
8
|
-
super(...arguments);
|
|
9
|
-
this.dispose = noop;
|
|
10
|
-
this.update = noop;
|
|
11
|
-
this.props = {
|
|
12
|
-
name: this.getAttribute('name'),
|
|
13
|
-
params: tryParseJson(this.getAttribute('params')),
|
|
14
|
-
empty: undefined,
|
|
15
|
-
};
|
|
16
|
-
}
|
|
17
|
-
get params() {
|
|
18
|
-
return this.props.params;
|
|
19
|
-
}
|
|
20
|
-
set params(value) {
|
|
21
|
-
this.props.params = value;
|
|
22
|
-
this.update(this.props);
|
|
23
|
-
}
|
|
24
|
-
get name() {
|
|
25
|
-
return this.props.name;
|
|
26
|
-
}
|
|
27
|
-
set name(value) {
|
|
28
|
-
this.props.name = value;
|
|
29
|
-
this.update(this.props);
|
|
30
|
-
}
|
|
31
|
-
get empty() {
|
|
32
|
-
return this.props.empty;
|
|
33
|
-
}
|
|
34
|
-
set empty(value) {
|
|
35
|
-
this.props.empty = value;
|
|
36
|
-
this.update(this.props);
|
|
37
|
-
}
|
|
38
|
-
connectedCallback() {
|
|
39
|
-
if (this.isConnected) {
|
|
40
|
-
this.dispatchEvent(new CustomEvent('render-html', {
|
|
41
|
-
bubbles: true,
|
|
42
|
-
detail: {
|
|
43
|
-
target: this,
|
|
44
|
-
props: this.props,
|
|
45
|
-
},
|
|
46
|
-
}));
|
|
47
|
-
}
|
|
48
|
-
}
|
|
49
|
-
disconnectedCallback() {
|
|
50
|
-
this.dispose();
|
|
51
|
-
this.dispose = noop;
|
|
52
|
-
this.update = noop;
|
|
53
|
-
}
|
|
54
|
-
attributeChangedCallback(name, _, newValue) {
|
|
55
|
-
switch (name) {
|
|
56
|
-
case 'name':
|
|
57
|
-
this.name = newValue;
|
|
58
|
-
break;
|
|
59
|
-
case 'params':
|
|
60
|
-
this.params = tryParseJson(newValue);
|
|
61
|
-
break;
|
|
62
|
-
}
|
|
63
|
-
}
|
|
64
|
-
static get observedAttributes() {
|
|
65
|
-
return ['name', 'params'];
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
customElements.define('piral-extension', PiralExtension);
|
|
69
|
-
}
|
|
70
|
-
function render(context, element, props) {
|
|
71
|
-
let [id, portal] = renderInDom(context, element, ExtensionSlot, props);
|
|
72
|
-
const evName = 'extension-props-changed';
|
|
73
|
-
const handler = (ev) => update(ev.detail);
|
|
74
|
-
const dispose = () => {
|
|
75
|
-
context.hidePortal(id, portal);
|
|
76
|
-
element.removeEventListener(evName, handler);
|
|
77
|
-
};
|
|
78
|
-
const update = (newProps) => {
|
|
79
|
-
[id, portal] = changeDomPortal(id, portal, context, element, ExtensionSlot, newProps);
|
|
80
|
-
};
|
|
81
|
-
element.addEventListener(evName, handler);
|
|
82
|
-
return [dispose, update];
|
|
83
|
-
}
|
|
84
|
-
export function createCoreApi(context) {
|
|
85
|
-
if (typeof document !== 'undefined') {
|
|
86
|
-
document.body.addEventListener('render-html', (ev) => {
|
|
87
|
-
ev.stopPropagation();
|
|
88
|
-
const container = ev.detail.target;
|
|
89
|
-
const [dispose, update] = render(context, container, ev.detail.props);
|
|
90
|
-
container.dispose = dispose;
|
|
91
|
-
container.update = update;
|
|
92
|
-
}, false);
|
|
93
|
-
}
|
|
94
|
-
return (api, target) => {
|
|
95
|
-
const pilet = target.name;
|
|
96
|
-
return {
|
|
97
|
-
getData(name) {
|
|
98
|
-
return context.readDataValue(name);
|
|
99
|
-
},
|
|
100
|
-
setData(name, value, options) {
|
|
101
|
-
const { target = 'memory', expires } = createDataOptions(options);
|
|
102
|
-
const expiration = getDataExpiration(expires);
|
|
103
|
-
return context.tryWriteDataItem(name, value, pilet, target, expiration);
|
|
104
|
-
},
|
|
105
|
-
registerPage(route, arg, meta) {
|
|
106
|
-
context.registerPage(route, {
|
|
107
|
-
pilet,
|
|
108
|
-
meta,
|
|
109
|
-
component: withApi(context, arg, api, 'page'),
|
|
110
|
-
});
|
|
111
|
-
return () => api.unregisterPage(route);
|
|
112
|
-
},
|
|
113
|
-
unregisterPage(route) {
|
|
114
|
-
context.unregisterPage(route);
|
|
115
|
-
},
|
|
116
|
-
registerExtension(name, arg, defaults) {
|
|
117
|
-
context.registerExtension(name, {
|
|
118
|
-
pilet,
|
|
119
|
-
component: withApi(context, arg, api, 'extension'),
|
|
120
|
-
reference: arg,
|
|
121
|
-
defaults,
|
|
122
|
-
});
|
|
123
|
-
return () => api.unregisterExtension(name, arg);
|
|
124
|
-
},
|
|
125
|
-
unregisterExtension(name, arg) {
|
|
126
|
-
context.unregisterExtension(name, arg);
|
|
127
|
-
},
|
|
128
|
-
renderHtmlExtension(element, props) {
|
|
129
|
-
const [dispose] = render(context, element, props);
|
|
130
|
-
return dispose;
|
|
131
|
-
},
|
|
132
|
-
Extension: ExtensionSlot,
|
|
133
|
-
};
|
|
134
|
-
};
|
|
135
|
-
}
|
|
2
|
+
import { createCoreApi } from './core';
|
|
136
3
|
export function createExtenders(context, apis) {
|
|
137
4
|
const creators = [createCoreApi, ...apis.filter(isfunc)];
|
|
138
5
|
return creators.map((c) => {
|
package/esm/modules/api.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"api.js","sourceRoot":"","sources":["../../src/modules/api.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,
|
|
1
|
+
{"version":3,"file":"api.js","sourceRoot":"","sources":["../../src/modules/api.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,MAAM,EAAmB,aAAa,EAAE,SAAS,EAAE,MAAM,YAAY,CAAC;AAE/E,OAAO,EAAE,aAAa,EAAE,MAAM,QAAQ,CAAC;AAGvC,MAAM,UAAU,eAAe,CAAC,OAA2B,EAAE,IAAwB;IACnF,MAAM,QAAQ,GAAuB,CAAC,aAAa,EAAE,GAAG,IAAI,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC;IAC7E,OAAO,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,EAAE;QACxB,MAAM,GAAG,GAAG,CAAC,CAAC,OAAO,CAAC,CAAC;QAEvB,IAAI,MAAM,CAAC,GAAG,CAAC,EAAE;YACf,OAAO,GAAG,CAAC;SACZ;aAAM;YACL,OAAO,GAAG,EAAE,CAAC,mBACR,GAAG,EACN,CAAC;SACJ;IACH,CAAC,CAAC,CAAC;AACL,CAAC;AAED,MAAM,UAAU,iBAAiB,CAAC,OAA2B,EAAE,IAAwB;IACrF,MAAM,SAAS,GAAG,eAAe,CAAC,OAAO,EAAE,IAAI,CAAC,CAAC;IACjD,OAAO,CAAC,MAAM,EAAE,EAAE;QAChB,MAAM,GAAG,GAAG,aAAa,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAC3C,OAAO,CAAC,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,GAAG,GAAG,CAAC;QAChC,OAAO,SAAS,CAAC,GAAG,EAAE,SAAS,EAAE,MAAM,CAAC,CAAC;IAC3C,CAAC,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,48 @@
|
|
|
1
|
+
import { renderElement } from './element';
|
|
2
|
+
import { withApi } from '../state';
|
|
3
|
+
import { ExtensionSlot } from '../components';
|
|
4
|
+
import { createDataOptions, getDataExpiration } from '../utils';
|
|
5
|
+
export function createCoreApi(context) {
|
|
6
|
+
return (api, meta) => {
|
|
7
|
+
const pilet = meta.name;
|
|
8
|
+
return {
|
|
9
|
+
getData(name) {
|
|
10
|
+
return context.readDataValue(name);
|
|
11
|
+
},
|
|
12
|
+
setData(name, value, options) {
|
|
13
|
+
const { target = 'memory', expires } = createDataOptions(options);
|
|
14
|
+
const expiration = getDataExpiration(expires);
|
|
15
|
+
return context.tryWriteDataItem(name, value, pilet, target, expiration);
|
|
16
|
+
},
|
|
17
|
+
registerPage(route, arg, meta) {
|
|
18
|
+
context.registerPage(route, {
|
|
19
|
+
pilet,
|
|
20
|
+
meta,
|
|
21
|
+
component: withApi(context, arg, api, 'page'),
|
|
22
|
+
});
|
|
23
|
+
return () => api.unregisterPage(route);
|
|
24
|
+
},
|
|
25
|
+
unregisterPage(route) {
|
|
26
|
+
context.unregisterPage(route);
|
|
27
|
+
},
|
|
28
|
+
registerExtension(name, arg, defaults) {
|
|
29
|
+
context.registerExtension(name, {
|
|
30
|
+
pilet,
|
|
31
|
+
component: withApi(context, arg, api, 'extension'),
|
|
32
|
+
reference: arg,
|
|
33
|
+
defaults,
|
|
34
|
+
});
|
|
35
|
+
return () => api.unregisterExtension(name, arg);
|
|
36
|
+
},
|
|
37
|
+
unregisterExtension(name, arg) {
|
|
38
|
+
context.unregisterExtension(name, arg);
|
|
39
|
+
},
|
|
40
|
+
renderHtmlExtension(element, props) {
|
|
41
|
+
const [dispose] = renderElement(context, element, props);
|
|
42
|
+
return dispose;
|
|
43
|
+
},
|
|
44
|
+
Extension: ExtensionSlot,
|
|
45
|
+
};
|
|
46
|
+
};
|
|
47
|
+
}
|
|
48
|
+
//# sourceMappingURL=core.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"core.js","sourceRoot":"","sources":["../../src/modules/core.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,WAAW,CAAC;AAC1C,OAAO,EAAE,OAAO,EAAE,MAAM,UAAU,CAAC;AACnC,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,iBAAiB,EAAE,iBAAiB,EAAE,MAAM,UAAU,CAAC;AAGhE,MAAM,UAAU,aAAa,CAAC,OAA2B;IACvD,OAAO,CAAC,GAAG,EAAE,IAAI,EAAE,EAAE;QACnB,MAAM,KAAK,GAAG,IAAI,CAAC,IAAI,CAAC;QACxB,OAAO;YACL,OAAO,CAAC,IAAI;gBACV,OAAO,OAAO,CAAC,aAAa,CAAC,IAAI,CAAC,CAAC;YACrC,CAAC;YACD,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO;gBAC1B,MAAM,EAAE,MAAM,GAAG,QAAQ,EAAE,OAAO,EAAE,GAAG,iBAAiB,CAAC,OAAO,CAAC,CAAC;gBAClE,MAAM,UAAU,GAAG,iBAAiB,CAAC,OAAO,CAAC,CAAC;gBAC9C,OAAO,OAAO,CAAC,gBAAgB,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,UAAU,CAAC,CAAC;YAC1E,CAAC;YACD,YAAY,CAAC,KAAK,EAAE,GAAG,EAAE,IAAI;gBAC3B,OAAO,CAAC,YAAY,CAAC,KAAK,EAAE;oBAC1B,KAAK;oBACL,IAAI;oBACJ,SAAS,EAAE,OAAO,CAAC,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,MAAM,CAAC;iBAC9C,CAAC,CAAC;gBACH,OAAO,GAAG,EAAE,CAAC,GAAG,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;YACzC,CAAC;YACD,cAAc,CAAC,KAAK;gBAClB,OAAO,CAAC,cAAc,CAAC,KAAK,CAAC,CAAC;YAChC,CAAC;YACD,iBAAiB,CAAC,IAAI,EAAE,GAAG,EAAE,QAAQ;gBACnC,OAAO,CAAC,iBAAiB,CAAC,IAAc,EAAE;oBACxC,KAAK;oBACL,SAAS,EAAE,OAAO,CAAC,OAAO,EAAE,GAAG,EAAE,GAAG,EAAE,WAAW,CAAC;oBAClD,SAAS,EAAE,GAAG;oBACd,QAAQ;iBACT,CAAC,CAAC;gBACH,OAAO,GAAG,EAAE,CAAC,GAAG,CAAC,mBAAmB,CAAC,IAAI,EAAE,GAAG,CAAC,CAAC;YAClD,CAAC;YACD,mBAAmB,CAAC,IAAI,EAAE,GAAG;gBAC3B,OAAO,CAAC,mBAAmB,CAAC,IAAc,EAAE,GAAG,CAAC,CAAC;YACnD,CAAC;YACD,mBAAmB,CAAC,OAAO,EAAE,KAAK;gBAChC,MAAM,CAAC,OAAO,CAAC,GAAG,aAAa,CAAC,OAAO,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;gBACzD,OAAO,OAAO,CAAC;YACjB,CAAC;YACD,SAAS,EAAE,aAAa;SACzB,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC"}
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
import { ExtensionSlot } from '../components';
|
|
2
|
+
import { tryParseJson, noop, reactifyContent, renderInDom, changeDomPortal } from '../utils';
|
|
3
|
+
if (typeof window !== 'undefined' && 'customElements' in window) {
|
|
4
|
+
class PiralExtension extends HTMLElement {
|
|
5
|
+
constructor() {
|
|
6
|
+
super(...arguments);
|
|
7
|
+
this.dispose = noop;
|
|
8
|
+
this.update = noop;
|
|
9
|
+
this.props = {
|
|
10
|
+
name: this.getAttribute('name'),
|
|
11
|
+
params: tryParseJson(this.getAttribute('params')),
|
|
12
|
+
empty: undefined,
|
|
13
|
+
children: reactifyContent(this.childNodes),
|
|
14
|
+
};
|
|
15
|
+
}
|
|
16
|
+
get params() {
|
|
17
|
+
return this.props.params;
|
|
18
|
+
}
|
|
19
|
+
set params(value) {
|
|
20
|
+
this.props.params = value;
|
|
21
|
+
this.update(this.props);
|
|
22
|
+
}
|
|
23
|
+
get name() {
|
|
24
|
+
return this.props.name;
|
|
25
|
+
}
|
|
26
|
+
set name(value) {
|
|
27
|
+
this.props.name = value;
|
|
28
|
+
this.update(this.props);
|
|
29
|
+
}
|
|
30
|
+
get empty() {
|
|
31
|
+
return this.props.empty;
|
|
32
|
+
}
|
|
33
|
+
set empty(value) {
|
|
34
|
+
this.props.empty = value;
|
|
35
|
+
this.update(this.props);
|
|
36
|
+
}
|
|
37
|
+
connectedCallback() {
|
|
38
|
+
if (this.isConnected) {
|
|
39
|
+
this.dispatchEvent(new CustomEvent('render-html', {
|
|
40
|
+
bubbles: true,
|
|
41
|
+
detail: {
|
|
42
|
+
target: this,
|
|
43
|
+
props: this.props,
|
|
44
|
+
},
|
|
45
|
+
}));
|
|
46
|
+
}
|
|
47
|
+
}
|
|
48
|
+
disconnectedCallback() {
|
|
49
|
+
this.dispose();
|
|
50
|
+
this.dispose = noop;
|
|
51
|
+
this.update = noop;
|
|
52
|
+
}
|
|
53
|
+
attributeChangedCallback(name, _, newValue) {
|
|
54
|
+
switch (name) {
|
|
55
|
+
case 'name':
|
|
56
|
+
this.name = newValue;
|
|
57
|
+
break;
|
|
58
|
+
case 'params':
|
|
59
|
+
this.params = tryParseJson(newValue);
|
|
60
|
+
break;
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
static get observedAttributes() {
|
|
64
|
+
return ['name', 'params'];
|
|
65
|
+
}
|
|
66
|
+
}
|
|
67
|
+
customElements.define('piral-extension', PiralExtension);
|
|
68
|
+
}
|
|
69
|
+
export function renderElement(context, element, props) {
|
|
70
|
+
let [id, portal] = renderInDom(context, element, ExtensionSlot, props);
|
|
71
|
+
const evName = 'extension-props-changed';
|
|
72
|
+
const handler = (ev) => update(ev.detail);
|
|
73
|
+
const dispose = () => {
|
|
74
|
+
context.hidePortal(id, portal);
|
|
75
|
+
element.removeEventListener(evName, handler);
|
|
76
|
+
};
|
|
77
|
+
const update = (newProps) => {
|
|
78
|
+
[id, portal] = changeDomPortal(id, portal, context, element, ExtensionSlot, newProps);
|
|
79
|
+
};
|
|
80
|
+
element.addEventListener(evName, handler);
|
|
81
|
+
return [dispose, update];
|
|
82
|
+
}
|
|
83
|
+
//# sourceMappingURL=element.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"element.js","sourceRoot":"","sources":["../../src/modules/element.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,EAAE,YAAY,EAAE,IAAI,EAAE,eAAe,EAAE,WAAW,EAAE,eAAe,EAAE,MAAM,UAAU,CAAC;AAO7F,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,gBAAgB,IAAI,MAAM,EAAE;IAC/D,MAAM,cAAe,SAAQ,WAAW;QAAxC;;YACE,YAAO,GAAe,IAAI,CAAC;YAC3B,WAAM,GAAc,IAAI,CAAC;YACzB,UAAK,GAAG;gBACN,IAAI,EAAE,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;gBAC/B,MAAM,EAAE,YAAY,CAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;gBACjD,KAAK,EAAE,SAAS;gBAChB,QAAQ,EAAE,eAAe,CAAC,IAAI,CAAC,UAAU,CAAC;aAC3C,CAAC;QA+DJ,CAAC;QA7DC,IAAI,MAAM;YACR,OAAO,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC;QAC3B,CAAC;QAED,IAAI,MAAM,CAAC,KAAK;YACd,IAAI,CAAC,KAAK,CAAC,MAAM,GAAG,KAAK,CAAC;YAC1B,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC;QAED,IAAI,IAAI;YACN,OAAO,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC;QACzB,CAAC;QAED,IAAI,IAAI,CAAC,KAAK;YACZ,IAAI,CAAC,KAAK,CAAC,IAAI,GAAG,KAAK,CAAC;YACxB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC;QAED,IAAI,KAAK;YACP,OAAO,IAAI,CAAC,KAAK,CAAC,KAAK,CAAC;QAC1B,CAAC;QAED,IAAI,KAAK,CAAC,KAAK;YACb,IAAI,CAAC,KAAK,CAAC,KAAK,GAAG,KAAK,CAAC;YACzB,IAAI,CAAC,MAAM,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;QAC1B,CAAC;QAED,iBAAiB;YACf,IAAI,IAAI,CAAC,WAAW,EAAE;gBACpB,IAAI,CAAC,aAAa,CAChB,IAAI,WAAW,CAAC,aAAa,EAAE;oBAC7B,OAAO,EAAE,IAAI;oBACb,MAAM,EAAE;wBACN,MAAM,EAAE,IAAI;wBACZ,KAAK,EAAE,IAAI,CAAC,KAAK;qBAClB;iBACF,CAAC,CACH,CAAC;aACH;QACH,CAAC;QAED,oBAAoB;YAClB,IAAI,CAAC,OAAO,EAAE,CAAC;YACf,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;YACpB,IAAI,CAAC,MAAM,GAAG,IAAI,CAAC;QACrB,CAAC;QAED,wBAAwB,CAAC,IAAY,EAAE,CAAM,EAAE,QAAa;YAC1D,QAAQ,IAAI,EAAE;gBACZ,KAAK,MAAM;oBACT,IAAI,CAAC,IAAI,GAAG,QAAQ,CAAC;oBACrB,MAAM;gBACR,KAAK,QAAQ;oBACX,IAAI,CAAC,MAAM,GAAG,YAAY,CAAC,QAAQ,CAAC,CAAC;oBACrC,MAAM;aACT;QACH,CAAC;QAED,MAAM,KAAK,kBAAkB;YAC3B,OAAO,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;QAC5B,CAAC;KACF;IAED,cAAc,CAAC,MAAM,CAAC,iBAAiB,EAAE,cAAc,CAAC,CAAC;CAC1D;AAED,MAAM,UAAU,aAAa,CAC3B,OAA2B,EAC3B,OAAiC,EACjC,KAAU;IAEV,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC,GAAG,WAAW,CAAC,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,KAAK,CAAC,CAAC;IACvE,MAAM,MAAM,GAAG,yBAAyB,CAAC;IACzC,MAAM,OAAO,GAAG,CAAC,EAAe,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;IACvD,MAAM,OAAO,GAAe,GAAG,EAAE;QAC/B,OAAO,CAAC,UAAU,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;QAC/B,OAAO,CAAC,mBAAmB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC/C,CAAC,CAAC;IACF,MAAM,MAAM,GAAc,CAAC,QAAQ,EAAE,EAAE;QACrC,CAAC,EAAE,EAAE,MAAM,CAAC,GAAG,eAAe,CAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,aAAa,EAAE,QAAQ,CAAC,CAAC;IACxF,CAAC,CAAC;IACF,OAAO,CAAC,gBAAgB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IAC1C,OAAO,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;AAC3B,CAAC"}
|
package/esm/modules/index.d.ts
CHANGED
package/esm/modules/index.js
CHANGED
package/esm/modules/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/modules/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAC;AACtB,cAAc,gBAAgB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/modules/index.ts"],"names":[],"mappings":"AAAA,cAAc,OAAO,CAAC;AACtB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,WAAW,CAAC"}
|
package/esm/types/extension.d.ts
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
|
|
1
|
+
import type { ReactNode, ReactElement } from 'react';
|
|
2
2
|
import type { PiralCustomExtensionSlotMap } from './custom';
|
|
3
3
|
/**
|
|
4
4
|
* The mapping of the existing (known) extension slots.
|
|
@@ -9,16 +9,20 @@ export interface PiralExtensionSlotMap extends PiralCustomExtensionSlotMap {
|
|
|
9
9
|
* The basic props for defining an extension slot.
|
|
10
10
|
*/
|
|
11
11
|
export interface BaseExtensionSlotProps<TName, TParams> {
|
|
12
|
+
/**
|
|
13
|
+
* The children to transport, if any.
|
|
14
|
+
*/
|
|
15
|
+
children?: ReactNode;
|
|
12
16
|
/**
|
|
13
17
|
* Defines what should be rendered when no components are available
|
|
14
18
|
* for the specified extension.
|
|
15
19
|
*/
|
|
16
|
-
empty?():
|
|
20
|
+
empty?(): ReactNode;
|
|
17
21
|
/**
|
|
18
22
|
* Defines how the provided nodes should be rendered.
|
|
19
23
|
* @param nodes The rendered extension nodes.
|
|
20
24
|
*/
|
|
21
|
-
render?(nodes: Array<
|
|
25
|
+
render?(nodes: Array<ReactNode>): ReactElement<any, any> | null;
|
|
22
26
|
/**
|
|
23
27
|
* The custom parameters for the given extension.
|
|
24
28
|
*/
|
package/esm/utils/extension.d.ts
CHANGED
|
@@ -1,3 +1,16 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
2
|
import { ExtensionComponentProps, WrappedComponent } from '../types';
|
|
3
|
+
/**
|
|
4
|
+
* Transforms the given component to an extension component.
|
|
5
|
+
* @param Component The component to transform.
|
|
6
|
+
* @returns The extension component (receiving its props via params).
|
|
7
|
+
*/
|
|
3
8
|
export declare function toExtension<T>(Component: React.ComponentType<T>): WrappedComponent<ExtensionComponentProps<T>>;
|
|
9
|
+
/**
|
|
10
|
+
* Reactifies the list of child nodes to a React Node by removing the
|
|
11
|
+
* nodes from the DOM and carrying it in a React Node, where it would be
|
|
12
|
+
* attached at a slot.
|
|
13
|
+
* @param childNodes The child nodes to reactify.
|
|
14
|
+
* @returns The React Node.
|
|
15
|
+
*/
|
|
16
|
+
export declare function reactifyContent(childNodes: NodeListOf<ChildNode>): React.ReactNode;
|
package/esm/utils/extension.js
CHANGED
|
@@ -1,5 +1,37 @@
|
|
|
1
1
|
import * as React from 'react';
|
|
2
|
+
function removeAll(nodes) {
|
|
3
|
+
nodes.forEach((node) => node.remove());
|
|
4
|
+
}
|
|
5
|
+
const SlotCarrier = ({ nodes }) => {
|
|
6
|
+
const host = React.useRef();
|
|
7
|
+
React.useEffect(() => {
|
|
8
|
+
var _a;
|
|
9
|
+
(_a = host.current) === null || _a === void 0 ? void 0 : _a.append(...nodes);
|
|
10
|
+
return () => removeAll(nodes);
|
|
11
|
+
}, [nodes]);
|
|
12
|
+
if (nodes.length) {
|
|
13
|
+
return React.createElement("slot", { ref: host });
|
|
14
|
+
}
|
|
15
|
+
return null;
|
|
16
|
+
};
|
|
17
|
+
/**
|
|
18
|
+
* Transforms the given component to an extension component.
|
|
19
|
+
* @param Component The component to transform.
|
|
20
|
+
* @returns The extension component (receiving its props via params).
|
|
21
|
+
*/
|
|
2
22
|
export function toExtension(Component) {
|
|
3
23
|
return (props) => React.createElement(Component, Object.assign({}, props.params));
|
|
4
24
|
}
|
|
25
|
+
/**
|
|
26
|
+
* Reactifies the list of child nodes to a React Node by removing the
|
|
27
|
+
* nodes from the DOM and carrying it in a React Node, where it would be
|
|
28
|
+
* attached at a slot.
|
|
29
|
+
* @param childNodes The child nodes to reactify.
|
|
30
|
+
* @returns The React Node.
|
|
31
|
+
*/
|
|
32
|
+
export function reactifyContent(childNodes) {
|
|
33
|
+
const nodes = Array.prototype.filter.call(childNodes, Boolean);
|
|
34
|
+
removeAll(nodes);
|
|
35
|
+
return React.createElement(SlotCarrier, { nodes: nodes });
|
|
36
|
+
}
|
|
5
37
|
//# sourceMappingURL=extension.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"extension.js","sourceRoot":"","sources":["../../src/utils/extension.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,MAAM,UAAU,WAAW,CAAI,SAAiC;IAC9D,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,oBAAC,SAAS,oBAAK,KAAK,CAAC,MAAM,EAAI,CAAC;AACpD,CAAC"}
|
|
1
|
+
{"version":3,"file":"extension.js","sourceRoot":"","sources":["../../src/utils/extension.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAG/B,SAAS,SAAS,CAAC,KAAuB;IACxC,KAAK,CAAC,OAAO,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,EAAE,CAAC,CAAC;AACzC,CAAC;AAMD,MAAM,WAAW,GAA+B,CAAC,EAAE,KAAK,EAAE,EAAE,EAAE;IAC5D,MAAM,IAAI,GAAG,KAAK,CAAC,MAAM,EAAmB,CAAC;IAE7C,KAAK,CAAC,SAAS,CAAC,GAAG,EAAE;;QACnB,MAAA,IAAI,CAAC,OAAO,0CAAE,MAAM,CAAC,GAAG,KAAK,CAAC,CAAC;QAC/B,OAAO,GAAG,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,CAAC;IAChC,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC,CAAC;IAEZ,IAAI,KAAK,CAAC,MAAM,EAAE;QAChB,OAAO,8BAAM,GAAG,EAAE,IAAI,GAAI,CAAC;KAC5B;IAED,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF;;;;GAIG;AACH,MAAM,UAAU,WAAW,CAAI,SAAiC;IAC9D,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,oBAAC,SAAS,oBAAK,KAAK,CAAC,MAAM,EAAI,CAAC;AACpD,CAAC;AAED;;;;;;GAMG;AACH,MAAM,UAAU,eAAe,CAAC,UAAiC;IAC/D,MAAM,KAAK,GAAqB,KAAK,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,UAAU,EAAE,OAAO,CAAC,CAAC;IACjF,SAAS,CAAC,KAAK,CAAC,CAAC;IACjB,OAAO,oBAAC,WAAW,IAAC,KAAK,EAAE,KAAK,GAAI,CAAC;AACvC,CAAC"}
|
package/lib/Piral.js
CHANGED
|
@@ -5,6 +5,7 @@ const React = require("react");
|
|
|
5
5
|
const state_1 = require("./state");
|
|
6
6
|
const createInstance_1 = require("./createInstance");
|
|
7
7
|
const components_1 = require("./components");
|
|
8
|
+
const RootListener_1 = require("./RootListener");
|
|
8
9
|
/**
|
|
9
10
|
* Represents the Piral app shell frame. Use this component together
|
|
10
11
|
* with an existing instance to render the app shell.
|
|
@@ -23,6 +24,7 @@ const app = (
|
|
|
23
24
|
const Piral = ({ instance = (0, createInstance_1.createInstance)(), breakpoints, children }) => (React.createElement(state_1.StateContext.Provider, { value: instance.context },
|
|
24
25
|
React.createElement(components_1.ResponsiveLayout, { breakpoints: breakpoints }),
|
|
25
26
|
React.createElement(components_1.Mediator, { options: instance.options, key: instance.id }),
|
|
27
|
+
React.createElement(RootListener_1.RootListener, null),
|
|
26
28
|
React.createElement(components_1.PiralView, null,
|
|
27
29
|
React.createElement(components_1.PortalRenderer, { id: "root" }),
|
|
28
30
|
children)));
|
package/lib/Piral.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Piral.js","sourceRoot":"","sources":["../src/Piral.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,mCAAuC;AACvC,qDAAkD;AAClD,6CAAqF;
|
|
1
|
+
{"version":3,"file":"Piral.js","sourceRoot":"","sources":["../src/Piral.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,mCAAuC;AACvC,qDAAkD;AAClD,6CAAqF;AACrF,iDAA8C;AAG9C;;;;;;;;;;;;;;GAcG;AACI,MAAM,KAAK,GAAyB,CAAC,EAAE,QAAQ,GAAG,IAAA,+BAAc,GAAE,EAAE,WAAW,EAAE,QAAQ,EAAE,EAAE,EAAE,CAAC,CACrG,oBAAC,oBAAY,CAAC,QAAQ,IAAC,KAAK,EAAE,QAAQ,CAAC,OAAO;IAC5C,oBAAC,6BAAgB,IAAC,WAAW,EAAE,WAAW,GAAI;IAC9C,oBAAC,qBAAQ,IAAC,OAAO,EAAE,QAAQ,CAAC,OAAO,EAAE,GAAG,EAAE,QAAQ,CAAC,EAAE,GAAI;IACzD,oBAAC,2BAAY,OAAG;IAChB,oBAAC,sBAAS;QACR,oBAAC,2BAAc,IAAC,EAAE,EAAC,MAAM,GAAG;QAC3B,QAAQ,CACC,CACU,CACzB,CAAC;AAVW,QAAA,KAAK,SAUhB;AACF,aAAK,CAAC,WAAW,GAAG,OAAO,CAAC"}
|
|
@@ -0,0 +1,27 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
+
exports.RootListener = void 0;
|
|
4
|
+
const React = require("react");
|
|
5
|
+
const _1 = require(".");
|
|
6
|
+
const modules_1 = require("./modules");
|
|
7
|
+
const RootListener = () => {
|
|
8
|
+
const context = (0, _1.useGlobalStateContext)();
|
|
9
|
+
React.useLayoutEffect(() => {
|
|
10
|
+
if (typeof document !== 'undefined') {
|
|
11
|
+
const handler = (ev) => {
|
|
12
|
+
ev.stopPropagation();
|
|
13
|
+
const { target, props } = ev.detail;
|
|
14
|
+
const [dispose, update] = (0, modules_1.renderElement)(context, target, props);
|
|
15
|
+
target.dispose = dispose;
|
|
16
|
+
target.update = update;
|
|
17
|
+
};
|
|
18
|
+
document.body.addEventListener('render-html', handler, false);
|
|
19
|
+
return () => {
|
|
20
|
+
document.body.removeEventListener('render-html', handler, false);
|
|
21
|
+
};
|
|
22
|
+
}
|
|
23
|
+
}, [context]);
|
|
24
|
+
return null;
|
|
25
|
+
};
|
|
26
|
+
exports.RootListener = RootListener;
|
|
27
|
+
//# sourceMappingURL=RootListener.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"RootListener.js","sourceRoot":"","sources":["../src/RootListener.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,wBAA0C;AAC1C,uCAA0C;AAEnC,MAAM,YAAY,GAAa,GAAG,EAAE;IACzC,MAAM,OAAO,GAAG,IAAA,wBAAqB,GAAE,CAAC;IAExC,KAAK,CAAC,eAAe,CAAC,GAAG,EAAE;QACzB,IAAI,OAAO,QAAQ,KAAK,WAAW,EAAE;YACnC,MAAM,OAAO,GAAG,CAAC,EAAe,EAAE,EAAE;gBAClC,EAAE,CAAC,eAAe,EAAE,CAAC;gBACrB,MAAM,EAAE,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC;gBACpC,MAAM,CAAC,OAAO,EAAE,MAAM,CAAC,GAAG,IAAA,uBAAa,EAAC,OAAO,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;gBAChE,MAAM,CAAC,OAAO,GAAG,OAAO,CAAC;gBACzB,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC;YACzB,CAAC,CAAC;YACF,QAAQ,CAAC,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;YAE9D,OAAO,GAAG,EAAE;gBACV,QAAQ,CAAC,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE,OAAO,EAAE,KAAK,CAAC,CAAC;YACnE,CAAC,CAAC;SACH;IACH,CAAC,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC;IAEd,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AArBW,QAAA,YAAY,gBAqBvB"}
|
|
@@ -11,11 +11,11 @@ const utils_1 = require("../utils");
|
|
|
11
11
|
* location.
|
|
12
12
|
*/
|
|
13
13
|
function ExtensionSlot(props) {
|
|
14
|
-
const { name, render = utils_1.defaultRender, empty, params } = props;
|
|
14
|
+
const { name, render = utils_1.defaultRender, empty, params, children } = props;
|
|
15
15
|
const extensions = (0, hooks_1.useGlobalState)((s) => s.registry.extensions[name] || utils_1.none);
|
|
16
16
|
return render(extensions.length === 0 && (0, piral_base_1.isfunc)(empty)
|
|
17
17
|
? [(0, utils_1.defaultRender)(empty(), 'empty')]
|
|
18
|
-
: extensions.map(({ component: Component, reference, defaults = {} }, i) => (React.createElement(Component, { key: `${(reference === null || reference === void 0 ? void 0 : reference.displayName) || '_'}${i}`, params: Object.assign(Object.assign({}, defaults), (params || {})) }))));
|
|
18
|
+
: extensions.map(({ component: Component, reference, defaults = {} }, i) => (React.createElement(Component, { key: `${(reference === null || reference === void 0 ? void 0 : reference.displayName) || '_'}${i}`, children: children, params: Object.assign(Object.assign({}, defaults), (params || {})) }))));
|
|
19
19
|
}
|
|
20
20
|
exports.ExtensionSlot = ExtensionSlot;
|
|
21
21
|
ExtensionSlot.displayName = `ExtensionSlot`;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ExtensionSlot.js","sourceRoot":"","sources":["../../src/components/ExtensionSlot.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,2CAAoC;AACpC,oCAA0C;AAC1C,oCAA+C;AAG/C;;;;GAIG;AACH,SAAgB,aAAa,CAAmB,KAA4B;IAC1E,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,qBAAa,EAAE,KAAK,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;
|
|
1
|
+
{"version":3,"file":"ExtensionSlot.js","sourceRoot":"","sources":["../../src/components/ExtensionSlot.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,2CAAoC;AACpC,oCAA0C;AAC1C,oCAA+C;AAG/C;;;;GAIG;AACH,SAAgB,aAAa,CAAmB,KAA4B;IAC1E,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,qBAAa,EAAE,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,GAAG,KAAK,CAAC;IACxE,MAAM,UAAU,GAAG,IAAA,sBAAc,EAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,UAAU,CAAC,IAAI,CAAC,IAAI,YAAI,CAAC,CAAC;IAC9E,OAAO,MAAM,CACX,UAAU,CAAC,MAAM,KAAK,CAAC,IAAI,IAAA,mBAAM,EAAC,KAAK,CAAC;QACtC,CAAC,CAAC,CAAC,IAAA,qBAAa,EAAC,KAAK,EAAE,EAAE,OAAO,CAAC,CAAC;QACnC,CAAC,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,EAAE,SAAS,EAAE,SAAS,EAAE,SAAS,EAAE,QAAQ,GAAG,EAAE,EAAE,EAAE,CAAC,EAAE,EAAE,CAAC,CACxE,oBAAC,SAAS,IACR,GAAG,EAAE,GAAG,CAAA,SAAS,aAAT,SAAS,uBAAT,SAAS,CAAE,WAAW,KAAI,GAAG,GAAG,CAAC,EAAE,EAC3C,QAAQ,EAAE,QAAQ,EAClB,MAAM,kCACD,QAAQ,GACR,CAAC,MAAM,IAAI,EAAE,CAAC,IAEnB,CACH,CAAC,CACP,CAAC;AACJ,CAAC;AAjBD,sCAiBC;AAED,aAAa,CAAC,WAAW,GAAG,eAAe,CAAC"}
|
package/lib/modules/api.d.ts
CHANGED
|
@@ -1,5 +1,4 @@
|
|
|
1
|
-
import { PiletApiCreator
|
|
2
|
-
import { GlobalStateContext,
|
|
3
|
-
export declare function
|
|
4
|
-
export declare function createExtenders(context: GlobalStateContext, apis: Array<PiralPlugin>): PiletApiExtender<Partial<import("piral-base").PiletApi>>[];
|
|
1
|
+
import { PiletApiCreator } from 'piral-base';
|
|
2
|
+
import { GlobalStateContext, PiralPlugin } from '../types';
|
|
3
|
+
export declare function createExtenders(context: GlobalStateContext, apis: Array<PiralPlugin>): import("piral-base").PiletApiExtender<Partial<import("piral-base").PiletApi>>[];
|
|
5
4
|
export declare function defaultApiFactory(context: GlobalStateContext, apis: Array<PiralPlugin>): PiletApiCreator;
|