piral-core 0.15.0-beta.4630 → 0.15.0-beta.4670

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.
Files changed (34) hide show
  1. package/app.codegen +14 -0
  2. package/esm/components/ForeignComponentContainer.js +1 -1
  3. package/esm/components/ForeignComponentContainer.js.map +1 -1
  4. package/esm/modules/element.js +46 -2
  5. package/esm/modules/element.js.map +1 -1
  6. package/esm/types/navigation.d.ts +4 -0
  7. package/esm/utils/extension.d.ts +1 -1
  8. package/esm/utils/extension.js +1 -1
  9. package/esm/utils/extension.js.map +1 -1
  10. package/esm/utils/foreign.d.ts +3 -0
  11. package/esm/utils/foreign.js +5 -2
  12. package/esm/utils/foreign.js.map +1 -1
  13. package/lib/components/ForeignComponentContainer.js +1 -1
  14. package/lib/components/ForeignComponentContainer.js.map +1 -1
  15. package/lib/modules/element.js +45 -1
  16. package/lib/modules/element.js.map +1 -1
  17. package/lib/types/navigation.d.ts +4 -0
  18. package/lib/utils/extension.d.ts +1 -1
  19. package/lib/utils/extension.js +1 -1
  20. package/lib/utils/extension.js.map +1 -1
  21. package/lib/utils/foreign.d.ts +3 -0
  22. package/lib/utils/foreign.js +6 -3
  23. package/lib/utils/foreign.js.map +1 -1
  24. package/package.json +5 -4
  25. package/src/components/ForeignComponentContainer.test.tsx +1 -1
  26. package/src/components/ForeignComponentContainer.tsx +2 -1
  27. package/src/modules/element.test.ts +0 -10
  28. package/src/modules/element.ts +60 -2
  29. package/src/types/api.ts +1 -0
  30. package/src/types/navigation.ts +4 -0
  31. package/src/utils/extension.test.tsx +1 -1
  32. package/src/utils/extension.tsx +3 -2
  33. package/src/utils/foreign.test.ts +5 -5
  34. package/src/utils/foreign.ts +6 -2
package/app.codegen CHANGED
@@ -93,6 +93,13 @@ function createDefaultState(imports, exports) {
93
93
  });
94
94
 
95
95
  return {
96
+ get path() {
97
+ if (_nav) {
98
+ return _nav.location.pathname;
99
+ }
100
+
101
+ return location.pathname;
102
+ },
96
103
  push(target, state) {
97
104
  if (_nav) {
98
105
  _nav.push(target, state);
@@ -158,6 +165,13 @@ function createDefaultState(imports, exports) {
158
165
  });
159
166
 
160
167
  return {
168
+ get path() {
169
+ if (_nav) {
170
+ return _nav.location.pathname;
171
+ }
172
+
173
+ return location.pathname;
174
+ },
161
175
  push(target, state) {
162
176
  if (_nav) {
163
177
  _nav.push(target, state);
package/esm/components/ForeignComponentContainer.js CHANGED
@@ -47,7 +47,7 @@ export class ForeignComponentContainer extends React.Component {
47
47
  }
48
48
  render() {
49
49
  const { $portalId } = this.props;
50
- return React.createElement("div", { "data-portal-id": $portalId, ref: this.setNode });
50
+ return React.createElement("piral-portal", { pid: $portalId, ref: this.setNode });
51
51
  }
52
52
  }
53
53
  //# sourceMappingURL=ForeignComponentContainer.js.map
package/esm/components/ForeignComponentContainer.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ForeignComponentContainer.js","sourceRoot":"","sources":["../../src/components/ForeignComponentContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AAUpC,MAAM,OAAO,yBAA6B,SAAQ,KAAK,CAAC,SAA4C;IAApG;;QACU,WAAM,GAAyB,EAAE,CAAC;QAGlC,YAAO,GAAG,CAAC,EAAe,EAAE,EAAE;YACpC,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;YAClC,EAAE,CAAC,eAAe,EAAE,CAAC;YACrB,UAAU,CAAC,KAAK,CAAC,mBAAmB,CAAC,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC1E,CAAC,CAAC;QAEM,YAAO,GAAG,CAAC,IAAoB,EAAE,EAAE;YACzC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACtB,CAAC,CAAC;IA6CJ,CAAC;IA3CC,iBAAiB;QACf,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC;QAC1B,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACxD,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,CAAC;QAE7B,IAAI,IAAI,IAAI,MAAM,CAAC,KAAK,CAAC,EAAE;YACzB,KAAK,CAAC,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YAC/C,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;SAC3D;QAED,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IACvB,CAAC;IAED,kBAAkB;QAChB,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QACnC,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACxD,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC;QAE9B,IAAI,OAAO,KAAK,QAAQ,EAAE;YACxB,QAAQ,IAAI,IAAI,CAAC,oBAAoB,EAAE,CAAC;YACxC,OAAO,IAAI,IAAI,CAAC,iBAAiB,EAAE,CAAC;SACrC;aAAM,IAAI,MAAM,CAAC,MAAM,CAAC,EAAE;YACzB,MAAM,CAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;SACpD;IACH,CAAC;IAED,oBAAoB;QAClB,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC3B,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAClC,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC;QAE/B,IAAI,IAAI,IAAI,MAAM,CAAC,OAAO,CAAC,EAAE;YAC3B,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YAC3B,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;SAC9D;QAED,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;IAC5B,CAAC;IAED,MAAM;QACJ,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACjC,OAAO,+CAAqB,SAAS,EAAE,GAAG,EAAE,IAAI,CAAC,OAAO,GAAI,CAAC;IAC/D,CAAC;CACF"}
1
+ {"version":3,"file":"ForeignComponentContainer.js","sourceRoot":"","sources":["../../src/components/ForeignComponentContainer.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,EAAE,MAAM,EAAE,MAAM,YAAY,CAAC;AAWpC,MAAM,OAAO,yBAA6B,SAAQ,KAAK,CAAC,SAA4C;IAApG;;QACU,WAAM,GAAyB,EAAE,CAAC;QAGlC,YAAO,GAAG,CAAC,EAAe,EAAE,EAAE;YACpC,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;YAClC,EAAE,CAAC,eAAe,EAAE,CAAC;YACrB,UAAU,CAAC,KAAK,CAAC,mBAAmB,CAAC,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC1E,CAAC,CAAC;QAEM,YAAO,GAAG,CAAC,IAAoB,EAAE,EAAE;YACzC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACtB,CAAC,CAAC;IA6CJ,CAAC;IA3CC,iBAAiB;QACf,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC;QAC1B,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACxD,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,CAAC;QAE7B,IAAI,IAAI,IAAI,MAAM,CAAC,KAAK,CAAC,EAAE;YACzB,KAAK,CAAC,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YAC/C,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;SAC3D;QAED,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IACvB,CAAC;IAED,kBAAkB;QAChB,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QACnC,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACxD,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC;QAE9B,IAAI,OAAO,KAAK,QAAQ,EAAE;YACxB,QAAQ,IAAI,IAAI,CAAC,oBAAoB,EAAE,CAAC;YACxC,OAAO,IAAI,IAAI,CAAC,iBAAiB,EAAE,CAAC;SACrC;aAAM,IAAI,MAAM,CAAC,MAAM,CAAC,EAAE;YACzB,MAAM,CAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;SACpD;IACH,CAAC;IAED,oBAAoB;QAClB,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC3B,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAClC,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC;QAE/B,IAAI,IAAI,IAAI,MAAM,CAAC,OAAO,CAAC,EAAE;YAC3B,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YAC3B,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;SAC9D;QAED,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;IAC5B,CAAC;IAED,MAAM;QACJ,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACjC,OAAO,sCAAc,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,IAAI,CAAC,OAAO,GAAI,CAAC;IAC7D,CAAC;CACF"}
package/esm/modules/element.js CHANGED
@@ -1,6 +1,16 @@
1
1
  import { ExtensionSlot } from '../components';
2
- import { tryParseJson, noop, reactifyContent, renderInDom, changeDomPortal } from '../utils';
2
+ import { tryParseJson, noop, reactifyContent, renderInDom, changeDomPortal, portalName, extensionName, slotName, } from '../utils';
3
3
  if (typeof window !== 'undefined' && 'customElements' in window) {
4
+ /**
5
+ * This is a nice abstraction allowing anyone to actually use the extension system
6
+ * brought by Piral. Not all props of the extension system are actually exposed.
7
+ *
8
+ * Usage:
9
+ *
10
+ * ```
11
+ * <piral-extension name="my-ext-name"></piral-extension>
12
+ * ```
13
+ */
4
14
  class PiralExtension extends HTMLElement {
5
15
  constructor() {
6
16
  super(...arguments);
@@ -35,6 +45,7 @@ if (typeof window !== 'undefined' && 'customElements' in window) {
35
45
  this.update(this.props);
36
46
  }
37
47
  connectedCallback() {
48
+ this.style.display = 'contents';
38
49
  if (this.isConnected) {
39
50
  this.dispatchEvent(new CustomEvent('render-html', {
40
51
  bubbles: true,
@@ -64,7 +75,40 @@ if (typeof window !== 'undefined' && 'customElements' in window) {
64
75
  return ['name', 'params'];
65
76
  }
66
77
  }
67
- customElements.define('piral-extension', PiralExtension);
78
+ customElements.define(extensionName, PiralExtension);
79
+ /**
80
+ * This is a boundary to host elements from other frameworks - effectively vanishing
81
+ * at runtime.
82
+ *
83
+ * Usage:
84
+ *
85
+ * ```
86
+ * <piral-portal pid="host-1234"></piral-portal>
87
+ * ```
88
+ */
89
+ class PiralPortal extends HTMLElement {
90
+ connectedCallback() {
91
+ this.style.display = 'contents';
92
+ }
93
+ }
94
+ customElements.define(portalName, PiralPortal);
95
+ /**
96
+ * This is a virtual element to aggregate rendering from other frameworks, mostly
97
+ * used like piral-portal, but without context-hosting capabilities. This would
98
+ * be used exclusively within a foreign framework, not from Piral to initiate.
99
+ *
100
+ * Usage:
101
+ *
102
+ * ```
103
+ * <piral-slot></piral-slot>
104
+ * ```
105
+ */
106
+ class PiralSlot extends HTMLElement {
107
+ connectedCallback() {
108
+ this.style.display = 'contents';
109
+ }
110
+ }
111
+ customElements.define(slotName, PiralSlot);
68
112
  }
69
113
  export function renderElement(context, element, props) {
70
114
  if (typeof window !== 'undefined') {
package/esm/modules/element.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"element.js","sourceRoot":"","sources":["../../src/modules/element.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"element.js","sourceRoot":"","sources":["../../src/modules/element.ts"],"names":[],"mappings":"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"}
package/esm/types/navigation.d.ts CHANGED
@@ -78,6 +78,10 @@ export interface NavigationApi {
78
78
  * @returns The disposable for stopping the block.
79
79
  */
80
80
  listen(listener: NavigationListener): Disposable;
81
+ /**
82
+ * Gets the current path.
83
+ */
84
+ path: string;
81
85
  /**
82
86
  * The original router behind the navigation.
83
87
  */
package/esm/utils/extension.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { ExtensionComponentProps, WrappedComponent } from '../types';
2
+ import type { ExtensionComponentProps, WrappedComponent } from '../types';
3
3
  /**
4
4
  * Transforms the given component to an extension component.
5
5
  * @param Component The component to transform.
package/esm/utils/extension.js CHANGED
@@ -10,7 +10,7 @@ const SlotCarrier = ({ nodes }) => {
10
10
  return () => removeAll(nodes);
11
11
  }, [nodes]);
12
12
  if (nodes.length) {
13
- return React.createElement("slot", { ref: host });
13
+ return React.createElement("piral-slot", { ref: host });
14
14
  }
15
15
  return null;
16
16
  };
package/esm/utils/extension.js.map CHANGED
@@ -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,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"}
1
+ {"version":3,"file":"extension.js","sourceRoot":"","sources":["../../src/utils/extension.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAI/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,oCAAY,GAAG,EAAE,IAAI,GAAI,CAAC;KAClC;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/esm/utils/foreign.d.ts CHANGED
@@ -1,5 +1,8 @@
1
1
  import { ComponentType, ReactPortal } from 'react';
2
2
  import { GlobalStateContext, ForeignComponent } from '../types';
3
+ export declare const extensionName = "piral-extension";
4
+ export declare const portalName = "piral-portal";
5
+ export declare const slotName = "piral-slot";
3
6
  export declare function attachDomPortal<TProps>(id: string, context: GlobalStateContext, element: HTMLElement | ShadowRoot, component: ComponentType<TProps>, props: TProps): [string, ReactPortal];
4
7
  export declare function changeDomPortal<TProps>(id: string, current: ReactPortal, context: GlobalStateContext, element: HTMLElement | ShadowRoot, component: ComponentType<TProps>, props: TProps): [string, ReactPortal];
5
8
  export declare function convertComponent<T extends {
package/esm/utils/foreign.js CHANGED
@@ -1,5 +1,8 @@
1
1
  import { createElement } from 'react';
2
2
  import { createPortal } from 'react-dom';
3
+ export const extensionName = 'piral-extension';
4
+ export const portalName = 'piral-portal';
5
+ export const slotName = 'piral-slot';
3
6
  export function attachDomPortal(id, context, element, component, props) {
4
7
  const portal = createPortal(createElement(component, props), element);
5
8
  context.showPortal(id, portal);
@@ -17,10 +20,10 @@ export function convertComponent(converter, component) {
17
20
  return converter(component);
18
21
  }
19
22
  export function renderInDom(context, element, component, props) {
20
- const portalId = 'data-portal-id';
23
+ const portalId = 'pid';
21
24
  let parent = element;
22
25
  while (parent) {
23
- if (parent instanceof Element && parent.hasAttribute(portalId)) {
26
+ if (parent instanceof Element && parent.localName === portalName && parent.hasAttribute(portalId)) {
24
27
  const id = parent.getAttribute(portalId);
25
28
  return attachDomPortal(id, context, element, component, props);
26
29
  }
package/esm/utils/foreign.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"foreign.js","sourceRoot":"","sources":["../../src/utils/foreign.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAA8B,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAGzC,MAAM,UAAU,eAAe,CAC7B,EAAU,EACV,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,MAAM,GAAG,YAAY,CAAC,aAAa,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE,OAAsB,CAAC,CAAC;IACrF,OAAO,CAAC,UAAU,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;IAC/B,OAAO,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;AACtB,CAAC;AAED,MAAM,UAAU,eAAe,CAC7B,EAAU,EACV,OAAoB,EACpB,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,IAAI,GAAG,YAAY,CAAC,aAAa,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE,OAAsB,CAAC,CAAC;IACnF,OAAO,CAAC,YAAY,CAAC,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,CAAC;IACxC,OAAO,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC;AACpB,CAAC;AAED,MAAM,UAAU,gBAAgB,CAC9B,SAAgD,EAChD,SAAY;IAEZ,IAAI,OAAO,SAAS,KAAK,UAAU,EAAE;QACnC,MAAM,IAAI,KAAK,CAAC,uCAAuC,SAAS,CAAC,IAAI,eAAe,CAAC,CAAC;KACvF;IAED,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AAC9B,CAAC;AAED,MAAM,UAAU,WAAW,CACzB,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,QAAQ,GAAG,gBAAgB,CAAC;IAClC,IAAI,MAAM,GAAS,OAAO,CAAC;IAE3B,OAAO,MAAM,EAAE;QACb,IAAI,MAAM,YAAY,OAAO,IAAI,MAAM,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE;YAC9D,MAAM,EAAE,GAAG,MAAM,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;YACzC,OAAO,eAAe,CAAC,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC;SAChE;QAED,MAAM,GAAG,MAAM,CAAC,UAAU,IAAK,MAAqB,CAAC,IAAI,CAAC;KAC3D;IAED,OAAO,eAAe,CAAC,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC;AACrE,CAAC"}
1
+ {"version":3,"file":"foreign.js","sourceRoot":"","sources":["../../src/utils/foreign.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAA8B,MAAM,OAAO,CAAC;AAClE,OAAO,EAAE,YAAY,EAAE,MAAM,WAAW,CAAC;AAGzC,MAAM,CAAC,MAAM,aAAa,GAAG,iBAAiB,CAAC;AAC/C,MAAM,CAAC,MAAM,UAAU,GAAG,cAAc,CAAC;AACzC,MAAM,CAAC,MAAM,QAAQ,GAAG,YAAY,CAAC;AAErC,MAAM,UAAU,eAAe,CAC7B,EAAU,EACV,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,MAAM,GAAG,YAAY,CAAC,aAAa,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE,OAAsB,CAAC,CAAC;IACrF,OAAO,CAAC,UAAU,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;IAC/B,OAAO,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;AACtB,CAAC;AAED,MAAM,UAAU,eAAe,CAC7B,EAAU,EACV,OAAoB,EACpB,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,IAAI,GAAG,YAAY,CAAC,aAAa,CAAC,SAAS,EAAE,KAAK,CAAC,EAAE,OAAsB,CAAC,CAAC;IACnF,OAAO,CAAC,YAAY,CAAC,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,CAAC;IACxC,OAAO,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC;AACpB,CAAC;AAED,MAAM,UAAU,gBAAgB,CAC9B,SAAgD,EAChD,SAAY;IAEZ,IAAI,OAAO,SAAS,KAAK,UAAU,EAAE;QACnC,MAAM,IAAI,KAAK,CAAC,uCAAuC,SAAS,CAAC,IAAI,eAAe,CAAC,CAAC;KACvF;IAED,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AAC9B,CAAC;AAED,MAAM,UAAU,WAAW,CACzB,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,QAAQ,GAAG,KAAK,CAAC;IACvB,IAAI,MAAM,GAAS,OAAO,CAAC;IAE3B,OAAO,MAAM,EAAE;QACb,IAAI,MAAM,YAAY,OAAO,IAAI,MAAM,CAAC,SAAS,KAAK,UAAU,IAAI,MAAM,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE;YACjG,MAAM,EAAE,GAAG,MAAM,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;YACzC,OAAO,eAAe,CAAC,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC;SAChE;QAED,MAAM,GAAG,MAAM,CAAC,UAAU,IAAK,MAAqB,CAAC,IAAI,CAAC;KAC3D;IAED,OAAO,eAAe,CAAC,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC;AACrE,CAAC"}
package/lib/components/ForeignComponentContainer.js CHANGED
@@ -50,7 +50,7 @@ class ForeignComponentContainer extends React.Component {
50
50
  }
51
51
  render() {
52
52
  const { $portalId } = this.props;
53
- return React.createElement("div", { "data-portal-id": $portalId, ref: this.setNode });
53
+ return React.createElement("piral-portal", { pid: $portalId, ref: this.setNode });
54
54
  }
55
55
  }
56
56
  exports.ForeignComponentContainer = ForeignComponentContainer;
package/lib/components/ForeignComponentContainer.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"ForeignComponentContainer.js","sourceRoot":"","sources":["../../src/components/ForeignComponentContainer.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,2CAAoC;AAUpC,MAAa,yBAA6B,SAAQ,KAAK,CAAC,SAA4C;IAApG;;QACU,WAAM,GAAyB,EAAE,CAAC;QAGlC,YAAO,GAAG,CAAC,EAAe,EAAE,EAAE;YACpC,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;YAClC,EAAE,CAAC,eAAe,EAAE,CAAC;YACrB,UAAU,CAAC,KAAK,CAAC,mBAAmB,CAAC,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC1E,CAAC,CAAC;QAEM,YAAO,GAAG,CAAC,IAAoB,EAAE,EAAE;YACzC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACtB,CAAC,CAAC;IA6CJ,CAAC;IA3CC,iBAAiB;QACf,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC;QAC1B,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACxD,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,CAAC;QAE7B,IAAI,IAAI,IAAI,IAAA,mBAAM,EAAC,KAAK,CAAC,EAAE;YACzB,KAAK,CAAC,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YAC/C,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;SAC3D;QAED,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IACvB,CAAC;IAED,kBAAkB;QAChB,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QACnC,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACxD,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC;QAE9B,IAAI,OAAO,KAAK,QAAQ,EAAE;YACxB,QAAQ,IAAI,IAAI,CAAC,oBAAoB,EAAE,CAAC;YACxC,OAAO,IAAI,IAAI,CAAC,iBAAiB,EAAE,CAAC;SACrC;aAAM,IAAI,IAAA,mBAAM,EAAC,MAAM,CAAC,EAAE;YACzB,MAAM,CAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;SACpD;IACH,CAAC;IAED,oBAAoB;QAClB,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC3B,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAClC,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC;QAE/B,IAAI,IAAI,IAAI,IAAA,mBAAM,EAAC,OAAO,CAAC,EAAE;YAC3B,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YAC3B,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;SAC9D;QAED,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;IAC5B,CAAC;IAED,MAAM;QACJ,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACjC,OAAO,+CAAqB,SAAS,EAAE,GAAG,EAAE,IAAI,CAAC,OAAO,GAAI,CAAC;IAC/D,CAAC;CACF;AAzDD,8DAyDC"}
1
+ {"version":3,"file":"ForeignComponentContainer.js","sourceRoot":"","sources":["../../src/components/ForeignComponentContainer.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAC/B,2CAAoC;AAWpC,MAAa,yBAA6B,SAAQ,KAAK,CAAC,SAA4C;IAApG;;QACU,WAAM,GAAyB,EAAE,CAAC;QAGlC,YAAO,GAAG,CAAC,EAAe,EAAE,EAAE;YACpC,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;YAClC,EAAE,CAAC,eAAe,EAAE,CAAC;YACrB,UAAU,CAAC,KAAK,CAAC,mBAAmB,CAAC,EAAE,CAAC,MAAM,CAAC,MAAM,EAAE,EAAE,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;QAC1E,CAAC,CAAC;QAEM,YAAO,GAAG,CAAC,IAAoB,EAAE,EAAE;YACzC,IAAI,CAAC,OAAO,GAAG,IAAI,CAAC;QACtB,CAAC,CAAC;IA6CJ,CAAC;IA3CC,iBAAiB;QACf,MAAM,IAAI,GAAG,IAAI,CAAC,OAAO,CAAC;QAC1B,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACxD,MAAM,EAAE,KAAK,EAAE,GAAG,UAAU,CAAC;QAE7B,IAAI,IAAI,IAAI,IAAA,mBAAM,EAAC,KAAK,CAAC,EAAE;YACzB,KAAK,CAAC,IAAI,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YAC/C,IAAI,CAAC,gBAAgB,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;SAC3D;QAED,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;IACvB,CAAC;IAED,kBAAkB;QAChB,MAAM,EAAE,OAAO,EAAE,QAAQ,EAAE,GAAG,IAAI,CAAC;QACnC,MAAM,EAAE,UAAU,EAAE,QAAQ,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACxD,MAAM,EAAE,MAAM,EAAE,GAAG,UAAU,CAAC;QAE9B,IAAI,OAAO,KAAK,QAAQ,EAAE;YACxB,QAAQ,IAAI,IAAI,CAAC,oBAAoB,EAAE,CAAC;YACxC,OAAO,IAAI,IAAI,CAAC,iBAAiB,EAAE,CAAC;SACrC;aAAM,IAAI,IAAA,mBAAM,EAAC,MAAM,CAAC,EAAE;YACzB,MAAM,CAAC,OAAO,EAAE,UAAU,EAAE,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;SACpD;IACH,CAAC;IAED,oBAAoB;QAClB,MAAM,IAAI,GAAG,IAAI,CAAC,QAAQ,CAAC;QAC3B,MAAM,EAAE,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QAClC,MAAM,EAAE,OAAO,EAAE,GAAG,UAAU,CAAC;QAE/B,IAAI,IAAI,IAAI,IAAA,mBAAM,EAAC,OAAO,CAAC,EAAE;YAC3B,OAAO,CAAC,IAAI,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YAC3B,IAAI,CAAC,mBAAmB,CAAC,aAAa,EAAE,IAAI,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;SAC9D;QAED,IAAI,CAAC,QAAQ,GAAG,SAAS,CAAC;IAC5B,CAAC;IAED,MAAM;QACJ,MAAM,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC;QACjC,OAAO,sCAAc,GAAG,EAAE,SAAS,EAAE,GAAG,EAAE,IAAI,CAAC,OAAO,GAAI,CAAC;IAC7D,CAAC;CACF;AAzDD,8DAyDC"}
package/lib/modules/element.js CHANGED
@@ -4,6 +4,16 @@ exports.renderElement = void 0;
4
4
  const components_1 = require("../components");
5
5
  const utils_1 = require("../utils");
6
6
  if (typeof window !== 'undefined' && 'customElements' in window) {
7
+ /**
8
+ * This is a nice abstraction allowing anyone to actually use the extension system
9
+ * brought by Piral. Not all props of the extension system are actually exposed.
10
+ *
11
+ * Usage:
12
+ *
13
+ * ```
14
+ * <piral-extension name="my-ext-name"></piral-extension>
15
+ * ```
16
+ */
7
17
  class PiralExtension extends HTMLElement {
8
18
  constructor() {
9
19
  super(...arguments);
@@ -38,6 +48,7 @@ if (typeof window !== 'undefined' && 'customElements' in window) {
38
48
  this.update(this.props);
39
49
  }
40
50
  connectedCallback() {
51
+ this.style.display = 'contents';
41
52
  if (this.isConnected) {
42
53
  this.dispatchEvent(new CustomEvent('render-html', {
43
54
  bubbles: true,
@@ -67,7 +78,40 @@ if (typeof window !== 'undefined' && 'customElements' in window) {
67
78
  return ['name', 'params'];
68
79
  }
69
80
  }
70
- customElements.define('piral-extension', PiralExtension);
81
+ customElements.define(utils_1.extensionName, PiralExtension);
82
+ /**
83
+ * This is a boundary to host elements from other frameworks - effectively vanishing
84
+ * at runtime.
85
+ *
86
+ * Usage:
87
+ *
88
+ * ```
89
+ * <piral-portal pid="host-1234"></piral-portal>
90
+ * ```
91
+ */
92
+ class PiralPortal extends HTMLElement {
93
+ connectedCallback() {
94
+ this.style.display = 'contents';
95
+ }
96
+ }
97
+ customElements.define(utils_1.portalName, PiralPortal);
98
+ /**
99
+ * This is a virtual element to aggregate rendering from other frameworks, mostly
100
+ * used like piral-portal, but without context-hosting capabilities. This would
101
+ * be used exclusively within a foreign framework, not from Piral to initiate.
102
+ *
103
+ * Usage:
104
+ *
105
+ * ```
106
+ * <piral-slot></piral-slot>
107
+ * ```
108
+ */
109
+ class PiralSlot extends HTMLElement {
110
+ connectedCallback() {
111
+ this.style.display = 'contents';
112
+ }
113
+ }
114
+ customElements.define(utils_1.slotName, PiralSlot);
71
115
  }
72
116
  function renderElement(context, element, props) {
73
117
  if (typeof window !== 'undefined') {
package/lib/modules/element.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"element.js","sourceRoot":"","sources":["../../src/modules/element.ts"],"names":[],"mappings":";;;AAAA,8CAA8C;AAC9C,oCAA6F;AAO7F,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,gBAAgB,IAAI,MAAM,EAAE;IAC/D,MAAM,cAAe,SAAQ,WAAW;QAAxC;;YACE,YAAO,GAAe,YAAI,CAAC;YAC3B,WAAM,GAAc,YAAI,CAAC;YACzB,UAAK,GAAG;gBACN,IAAI,EAAE,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;gBAC/B,MAAM,EAAE,IAAA,oBAAY,EAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;gBACjD,KAAK,EAAE,SAAS;gBAChB,QAAQ,EAAE,IAAA,uBAAe,EAAC,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,YAAI,CAAC;YACpB,IAAI,CAAC,MAAM,GAAG,YAAI,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,IAAA,oBAAY,EAAC,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,SAAgB,aAAa,CAC3B,OAA2B,EAC3B,OAAiC,EACjC,KAAU;IAEV,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;QACjC,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC,GAAG,IAAA,mBAAW,EAAC,OAAO,EAAE,OAAO,EAAE,0BAAa,EAAE,KAAK,CAAC,CAAC;QACvE,MAAM,MAAM,GAAG,yBAAyB,CAAC;QACzC,MAAM,OAAO,GAAG,CAAC,EAAe,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;QACvD,MAAM,OAAO,GAAe,GAAG,EAAE;YAC/B,OAAO,CAAC,UAAU,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;YAC/B,OAAO,CAAC,mBAAmB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAC/C,CAAC,CAAC;QACF,MAAM,MAAM,GAAc,CAAC,QAAQ,EAAE,EAAE;YACrC,CAAC,EAAE,EAAE,MAAM,CAAC,GAAG,IAAA,uBAAe,EAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,0BAAa,EAAE,QAAQ,CAAC,CAAC;QACxF,CAAC,CAAC;QACF,OAAO,CAAC,gBAAgB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAC1C,OAAO,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;KAC1B;IAED,OAAO,CAAC,YAAI,EAAE,YAAI,CAAC,CAAC;AACtB,CAAC;AArBD,sCAqBC"}
1
+ {"version":3,"file":"element.js","sourceRoot":"","sources":["../../src/modules/element.ts"],"names":[],"mappings":";;;AAAA,8CAA8C;AAE9C,oCASkB;AAMlB,IAAI,OAAO,MAAM,KAAK,WAAW,IAAI,gBAAgB,IAAI,MAAM,EAAE;IAC/D;;;;;;;;;OASG;IACH,MAAM,cAAe,SAAQ,WAAW;QAAxC;;YACE,YAAO,GAAe,YAAI,CAAC;YAC3B,WAAM,GAAc,YAAI,CAAC;YACzB,UAAK,GAAG;gBACN,IAAI,EAAE,IAAI,CAAC,YAAY,CAAC,MAAM,CAAC;gBAC/B,MAAM,EAAE,IAAA,oBAAY,EAAC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;gBACjD,KAAK,EAAE,SAAS;gBAChB,QAAQ,EAAE,IAAA,uBAAe,EAAC,IAAI,CAAC,UAAU,CAAC;aAC3C,CAAC;QAiEJ,CAAC;QA/DC,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,CAAC,KAAK,CAAC,OAAO,GAAG,UAAU,CAAC;YAEhC,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,YAAI,CAAC;YACpB,IAAI,CAAC,MAAM,GAAG,YAAI,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,IAAA,oBAAY,EAAC,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,qBAAa,EAAE,cAAc,CAAC,CAAC;IAErD;;;;;;;;;OASG;IACH,MAAM,WAAY,SAAQ,WAAW;QACnC,iBAAiB;YACf,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,UAAU,CAAC;QAClC,CAAC;KACF;IAED,cAAc,CAAC,MAAM,CAAC,kBAAU,EAAE,WAAW,CAAC,CAAC;IAE/C;;;;;;;;;;OAUG;IACH,MAAM,SAAU,SAAQ,WAAW;QACjC,iBAAiB;YACf,IAAI,CAAC,KAAK,CAAC,OAAO,GAAG,UAAU,CAAC;QAClC,CAAC;KACF;IAED,cAAc,CAAC,MAAM,CAAC,gBAAQ,EAAE,SAAS,CAAC,CAAC;CAC5C;AAED,SAAgB,aAAa,CAC3B,OAA2B,EAC3B,OAAiC,EACjC,KAAU;IAEV,IAAI,OAAO,MAAM,KAAK,WAAW,EAAE;QACjC,IAAI,CAAC,EAAE,EAAE,MAAM,CAAC,GAAG,IAAA,mBAAW,EAAC,OAAO,EAAE,OAAO,EAAE,0BAAa,EAAE,KAAK,CAAC,CAAC;QACvE,MAAM,MAAM,GAAG,yBAAyB,CAAC;QACzC,MAAM,OAAO,GAAG,CAAC,EAAe,EAAE,EAAE,CAAC,MAAM,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC;QACvD,MAAM,OAAO,GAAe,GAAG,EAAE;YAC/B,OAAO,CAAC,UAAU,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;YAC/B,OAAO,CAAC,mBAAmB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAC/C,CAAC,CAAC;QACF,MAAM,MAAM,GAAc,CAAC,QAAQ,EAAE,EAAE;YACrC,CAAC,EAAE,EAAE,MAAM,CAAC,GAAG,IAAA,uBAAe,EAAC,EAAE,EAAE,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,0BAAa,EAAE,QAAQ,CAAC,CAAC;QACxF,CAAC,CAAC;QACF,OAAO,CAAC,gBAAgB,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;QAC1C,OAAO,CAAC,OAAO,EAAE,MAAM,CAAC,CAAC;KAC1B;IAED,OAAO,CAAC,YAAI,EAAE,YAAI,CAAC,CAAC;AACtB,CAAC;AArBD,sCAqBC"}
package/lib/types/navigation.d.ts CHANGED
@@ -78,6 +78,10 @@ export interface NavigationApi {
78
78
  * @returns The disposable for stopping the block.
79
79
  */
80
80
  listen(listener: NavigationListener): Disposable;
81
+ /**
82
+ * Gets the current path.
83
+ */
84
+ path: string;
81
85
  /**
82
86
  * The original router behind the navigation.
83
87
  */
package/lib/utils/extension.d.ts CHANGED
@@ -1,5 +1,5 @@
1
1
  import * as React from 'react';
2
- import { ExtensionComponentProps, WrappedComponent } from '../types';
2
+ import type { ExtensionComponentProps, WrappedComponent } from '../types';
3
3
  /**
4
4
  * Transforms the given component to an extension component.
5
5
  * @param Component The component to transform.
package/lib/utils/extension.js CHANGED
@@ -13,7 +13,7 @@ const SlotCarrier = ({ nodes }) => {
13
13
  return () => removeAll(nodes);
14
14
  }, [nodes]);
15
15
  if (nodes.length) {
16
- return React.createElement("slot", { ref: host });
16
+ return React.createElement("piral-slot", { ref: host });
17
17
  }
18
18
  return null;
19
19
  };
package/lib/utils/extension.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"extension.js","sourceRoot":"","sources":["../../src/utils/extension.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;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,SAAgB,WAAW,CAAI,SAAiC;IAC9D,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,oBAAC,SAAS,oBAAK,KAAK,CAAC,MAAM,EAAI,CAAC;AACpD,CAAC;AAFD,kCAEC;AAED;;;;;;GAMG;AACH,SAAgB,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;AAJD,0CAIC"}
1
+ {"version":3,"file":"extension.js","sourceRoot":"","sources":["../../src/utils/extension.tsx"],"names":[],"mappings":";;;AAAA,+BAA+B;AAI/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,oCAAY,GAAG,EAAE,IAAI,GAAI,CAAC;KAClC;IAED,OAAO,IAAI,CAAC;AACd,CAAC,CAAC;AAEF;;;;GAIG;AACH,SAAgB,WAAW,CAAI,SAAiC;IAC9D,OAAO,CAAC,KAAK,EAAE,EAAE,CAAC,oBAAC,SAAS,oBAAK,KAAK,CAAC,MAAM,EAAI,CAAC;AACpD,CAAC;AAFD,kCAEC;AAED;;;;;;GAMG;AACH,SAAgB,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;AAJD,0CAIC"}
package/lib/utils/foreign.d.ts CHANGED
@@ -1,5 +1,8 @@
1
1
  import { ComponentType, ReactPortal } from 'react';
2
2
  import { GlobalStateContext, ForeignComponent } from '../types';
3
+ export declare const extensionName = "piral-extension";
4
+ export declare const portalName = "piral-portal";
5
+ export declare const slotName = "piral-slot";
3
6
  export declare function attachDomPortal<TProps>(id: string, context: GlobalStateContext, element: HTMLElement | ShadowRoot, component: ComponentType<TProps>, props: TProps): [string, ReactPortal];
4
7
  export declare function changeDomPortal<TProps>(id: string, current: ReactPortal, context: GlobalStateContext, element: HTMLElement | ShadowRoot, component: ComponentType<TProps>, props: TProps): [string, ReactPortal];
5
8
  export declare function convertComponent<T extends {
package/lib/utils/foreign.js CHANGED
@@ -1,8 +1,11 @@
1
1
  "use strict";
2
2
  Object.defineProperty(exports, "__esModule", { value: true });
3
- exports.renderInDom = exports.convertComponent = exports.changeDomPortal = exports.attachDomPortal = void 0;
3
+ exports.renderInDom = exports.convertComponent = exports.changeDomPortal = exports.attachDomPortal = exports.slotName = exports.portalName = exports.extensionName = void 0;
4
4
  const react_1 = require("react");
5
5
  const react_dom_1 = require("react-dom");
6
+ exports.extensionName = 'piral-extension';
7
+ exports.portalName = 'piral-portal';
8
+ exports.slotName = 'piral-slot';
6
9
  function attachDomPortal(id, context, element, component, props) {
7
10
  const portal = (0, react_dom_1.createPortal)((0, react_1.createElement)(component, props), element);
8
11
  context.showPortal(id, portal);
@@ -23,10 +26,10 @@ function convertComponent(converter, component) {
23
26
  }
24
27
  exports.convertComponent = convertComponent;
25
28
  function renderInDom(context, element, component, props) {
26
- const portalId = 'data-portal-id';
29
+ const portalId = 'pid';
27
30
  let parent = element;
28
31
  while (parent) {
29
- if (parent instanceof Element && parent.hasAttribute(portalId)) {
32
+ if (parent instanceof Element && parent.localName === exports.portalName && parent.hasAttribute(portalId)) {
30
33
  const id = parent.getAttribute(portalId);
31
34
  return attachDomPortal(id, context, element, component, props);
32
35
  }
package/lib/utils/foreign.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"foreign.js","sourceRoot":"","sources":["../../src/utils/foreign.ts"],"names":[],"mappings":";;;AAAA,iCAAkE;AAClE,yCAAyC;AAGzC,SAAgB,eAAe,CAC7B,EAAU,EACV,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,MAAM,GAAG,IAAA,wBAAY,EAAC,IAAA,qBAAa,EAAC,SAAS,EAAE,KAAK,CAAC,EAAE,OAAsB,CAAC,CAAC;IACrF,OAAO,CAAC,UAAU,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;IAC/B,OAAO,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;AACtB,CAAC;AAVD,0CAUC;AAED,SAAgB,eAAe,CAC7B,EAAU,EACV,OAAoB,EACpB,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,IAAI,GAAG,IAAA,wBAAY,EAAC,IAAA,qBAAa,EAAC,SAAS,EAAE,KAAK,CAAC,EAAE,OAAsB,CAAC,CAAC;IACnF,OAAO,CAAC,YAAY,CAAC,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,CAAC;IACxC,OAAO,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC;AACpB,CAAC;AAXD,0CAWC;AAED,SAAgB,gBAAgB,CAC9B,SAAgD,EAChD,SAAY;IAEZ,IAAI,OAAO,SAAS,KAAK,UAAU,EAAE;QACnC,MAAM,IAAI,KAAK,CAAC,uCAAuC,SAAS,CAAC,IAAI,eAAe,CAAC,CAAC;KACvF;IAED,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AAC9B,CAAC;AATD,4CASC;AAED,SAAgB,WAAW,CACzB,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,QAAQ,GAAG,gBAAgB,CAAC;IAClC,IAAI,MAAM,GAAS,OAAO,CAAC;IAE3B,OAAO,MAAM,EAAE;QACb,IAAI,MAAM,YAAY,OAAO,IAAI,MAAM,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE;YAC9D,MAAM,EAAE,GAAG,MAAM,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;YACzC,OAAO,eAAe,CAAC,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC;SAChE;QAED,MAAM,GAAG,MAAM,CAAC,UAAU,IAAK,MAAqB,CAAC,IAAI,CAAC;KAC3D;IAED,OAAO,eAAe,CAAC,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC;AACrE,CAAC;AAnBD,kCAmBC"}
1
+ {"version":3,"file":"foreign.js","sourceRoot":"","sources":["../../src/utils/foreign.ts"],"names":[],"mappings":";;;AAAA,iCAAkE;AAClE,yCAAyC;AAG5B,QAAA,aAAa,GAAG,iBAAiB,CAAC;AAClC,QAAA,UAAU,GAAG,cAAc,CAAC;AAC5B,QAAA,QAAQ,GAAG,YAAY,CAAC;AAErC,SAAgB,eAAe,CAC7B,EAAU,EACV,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,MAAM,GAAG,IAAA,wBAAY,EAAC,IAAA,qBAAa,EAAC,SAAS,EAAE,KAAK,CAAC,EAAE,OAAsB,CAAC,CAAC;IACrF,OAAO,CAAC,UAAU,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;IAC/B,OAAO,CAAC,EAAE,EAAE,MAAM,CAAC,CAAC;AACtB,CAAC;AAVD,0CAUC;AAED,SAAgB,eAAe,CAC7B,EAAU,EACV,OAAoB,EACpB,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,IAAI,GAAG,IAAA,wBAAY,EAAC,IAAA,qBAAa,EAAC,SAAS,EAAE,KAAK,CAAC,EAAE,OAAsB,CAAC,CAAC;IACnF,OAAO,CAAC,YAAY,CAAC,EAAE,EAAE,OAAO,EAAE,IAAI,CAAC,CAAC;IACxC,OAAO,CAAC,EAAE,EAAE,IAAI,CAAC,CAAC;AACpB,CAAC;AAXD,0CAWC;AAED,SAAgB,gBAAgB,CAC9B,SAAgD,EAChD,SAAY;IAEZ,IAAI,OAAO,SAAS,KAAK,UAAU,EAAE;QACnC,MAAM,IAAI,KAAK,CAAC,uCAAuC,SAAS,CAAC,IAAI,eAAe,CAAC,CAAC;KACvF;IAED,OAAO,SAAS,CAAC,SAAS,CAAC,CAAC;AAC9B,CAAC;AATD,4CASC;AAED,SAAgB,WAAW,CACzB,OAA2B,EAC3B,OAAiC,EACjC,SAAgC,EAChC,KAAa;IAEb,MAAM,QAAQ,GAAG,KAAK,CAAC;IACvB,IAAI,MAAM,GAAS,OAAO,CAAC;IAE3B,OAAO,MAAM,EAAE;QACb,IAAI,MAAM,YAAY,OAAO,IAAI,MAAM,CAAC,SAAS,KAAK,kBAAU,IAAI,MAAM,CAAC,YAAY,CAAC,QAAQ,CAAC,EAAE;YACjG,MAAM,EAAE,GAAG,MAAM,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;YACzC,OAAO,eAAe,CAAC,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC;SAChE;QAED,MAAM,GAAG,MAAM,CAAC,UAAU,IAAK,MAAqB,CAAC,IAAI,CAAC;KAC3D;IAED,OAAO,eAAe,CAAC,MAAM,EAAE,OAAO,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,CAAC,CAAC;AACrE,CAAC;AAnBD,kCAmBC"}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "piral-core",
3
- "version": "0.15.0-beta.4630",
3
+ "version": "0.15.0-beta.4670",
4
4
  "description": "The core library for creating a Piral instance.",
5
5
  "keywords": [
6
6
  "portal",
@@ -70,8 +70,9 @@
70
70
  "test": "echo \"Error: run tests from root\" && exit 1"
71
71
  },
72
72
  "dependencies": {
73
- "piral-base": "0.15.0-beta.4630",
74
- "piral-debug-utils": "0.15.0-beta.4630",
73
+ "enhanced-resolve": "^5.10.0",
74
+ "piral-base": "0.15.0-beta.4670",
75
+ "piral-debug-utils": "0.15.0-beta.4670",
75
76
  "zustand": "^3.0.0"
76
77
  },
77
78
  "peerDependencies": {
@@ -97,5 +98,5 @@
97
98
  "react-router-dom",
98
99
  "tslib"
99
100
  ],
100
- "gitHead": "08aea96af9587e73b1a6c4eb108f94f285186b10"
101
+ "gitHead": "ffd8707600e028a55258028d394b76fe3a0cd175"
101
102
  }
package/src/components/ForeignComponentContainer.test.tsx CHANGED
@@ -108,7 +108,7 @@ describe('ForeignComponentContainer component', () => {
108
108
  );
109
109
  await act(resolveAfter);
110
110
  expect(mount).toHaveBeenCalled();
111
- const node = document.querySelector('[data-portal-id=foo]');
111
+ const node = document.querySelector('piral-portal[pid=foo]');
112
112
  expect(renderHtmlExtension).not.toHaveBeenCalled();
113
113
  node?.dispatchEvent(new CustomEvent('render-html', { detail: {} }));
114
114
  await act(resolveAfter);
package/src/components/ForeignComponentContainer.tsx CHANGED
@@ -1,5 +1,6 @@
1
1
  import * as React from 'react';
2
2
  import { isfunc } from 'piral-base';
3
+ import type {} from 'piral-debug-utils';
3
4
  import type { ForeignComponent, BaseComponentProps, ComponentContext } from '../types';
4
5
 
5
6
  interface ForeignComponentContainerProps<T> {
@@ -64,6 +65,6 @@ export class ForeignComponentContainer<T> extends React.Component<ForeignCompone
64
65
 
65
66
  render() {
66
67
  const { $portalId } = this.props;
67
- return <div data-portal-id={$portalId} ref={this.setNode} />;
68
+ return <piral-portal pid={$portalId} ref={this.setNode} />;
68
69
  }
69
70
  }
package/src/modules/element.test.ts CHANGED
@@ -3,16 +3,6 @@ import { createListener } from 'piral-base';
3
3
  import { createActions } from '../state';
4
4
  import { renderElement } from './element';
5
5
 
6
- declare global {
7
- interface HTMLElementTagNameMap {
8
- "piral-extension": HTMLElement & {
9
- params: any;
10
- name: string;
11
- empty: any;
12
- };
13
- }
14
- }
15
-
16
6
  function createMockContext(): [any, any] {
17
7
  const state: any = create(() => ({
18
8
  portals: {},
package/src/modules/element.ts CHANGED
@@ -1,12 +1,31 @@
1
1
  import { ExtensionSlot } from '../components';
2
- import { tryParseJson, noop, reactifyContent, renderInDom, changeDomPortal } from '../utils';
3
2
  import { Disposable, GlobalStateContext } from '../types';
3
+ import {
4
+ tryParseJson,
5
+ noop,
6
+ reactifyContent,
7
+ renderInDom,
8
+ changeDomPortal,
9
+ portalName,
10
+ extensionName,
11
+ slotName,
12
+ } from '../utils';
4
13
 
5
14
  export interface Updatable {
6
15
  (newProps: any): void;
7
16
  }
8
17
 
9
18
  if (typeof window !== 'undefined' && 'customElements' in window) {
19
+ /**
20
+ * This is a nice abstraction allowing anyone to actually use the extension system
21
+ * brought by Piral. Not all props of the extension system are actually exposed.
22
+ *
23
+ * Usage:
24
+ *
25
+ * ```
26
+ * <piral-extension name="my-ext-name"></piral-extension>
27
+ * ```
28
+ */
10
29
  class PiralExtension extends HTMLElement {
11
30
  dispose: Disposable = noop;
12
31
  update: Updatable = noop;
@@ -45,6 +64,8 @@ if (typeof window !== 'undefined' && 'customElements' in window) {
45
64
  }
46
65
 
47
66
  connectedCallback() {
67
+ this.style.display = 'contents';
68
+
48
69
  if (this.isConnected) {
49
70
  this.dispatchEvent(
50
71
  new CustomEvent('render-html', {
@@ -80,7 +101,44 @@ if (typeof window !== 'undefined' && 'customElements' in window) {
80
101
  }
81
102
  }
82
103
 
83
- customElements.define('piral-extension', PiralExtension);
104
+ customElements.define(extensionName, PiralExtension);
105
+
106
+ /**
107
+ * This is a boundary to host elements from other frameworks - effectively vanishing
108
+ * at runtime.
109
+ *
110
+ * Usage:
111
+ *
112
+ * ```
113
+ * <piral-portal pid="host-1234"></piral-portal>
114
+ * ```
115
+ */
116
+ class PiralPortal extends HTMLElement {
117
+ connectedCallback() {
118
+ this.style.display = 'contents';
119
+ }
120
+ }
121
+
122
+ customElements.define(portalName, PiralPortal);
123
+
124
+ /**
125
+ * This is a virtual element to aggregate rendering from other frameworks, mostly
126
+ * used like piral-portal, but without context-hosting capabilities. This would
127
+ * be used exclusively within a foreign framework, not from Piral to initiate.
128
+ *
129
+ * Usage:
130
+ *
131
+ * ```
132
+ * <piral-slot></piral-slot>
133
+ * ```
134
+ */
135
+ class PiralSlot extends HTMLElement {
136
+ connectedCallback() {
137
+ this.style.display = 'contents';
138
+ }
139
+ }
140
+
141
+ customElements.define(slotName, PiralSlot);
84
142
  }
85
143
 
86
144
  export function renderElement(
package/src/types/api.ts CHANGED
@@ -10,6 +10,7 @@ import type {
10
10
  PiletLoader,
11
11
  PiletLoadingStrategy,
12
12
  } from 'piral-base';
13
+ import type {} from 'piral-debug-utils';
13
14
  import type { PiletCustomApi, PiralCustomPageMeta } from './custom';
14
15
  import type { AnyComponent } from './components';
15
16
  import type { ExtensionParams, ExtensionSlotProps, PiralExtensionSlotMap } from './extension';
package/src/types/navigation.ts CHANGED
@@ -85,6 +85,10 @@ export interface NavigationApi {
85
85
  * @returns The disposable for stopping the block.
86
86
  */
87
87
  listen(listener: NavigationListener): Disposable;
88
+ /**
89
+ * Gets the current path.
90
+ */
91
+ path: string;
88
92
  /**
89
93
  * The original router behind the navigation.
90
94
  */
package/src/utils/extension.test.tsx CHANGED
@@ -16,6 +16,6 @@ describe('Util Extension.', () => {
16
16
  container.innerHTML = `<div>FOO<</div>`;
17
17
  const result = reactifyContent(container.childNodes) as React.ReactElement;
18
18
  const node = render(result);
19
- expect(node.container.querySelectorAll('slot').length).toBe(1);
19
+ expect(node.container.querySelectorAll('piral-slot').length).toBe(1);
20
20
  });
21
21
  });
package/src/utils/extension.tsx CHANGED
@@ -1,5 +1,6 @@
1
1
  import * as React from 'react';
2
- import { ExtensionComponentProps, WrappedComponent } from '../types';
2
+ import type {} from 'piral-debug-utils';
3
+ import type { ExtensionComponentProps, WrappedComponent } from '../types';
3
4
 
4
5
  function removeAll(nodes: Array<ChildNode>) {
5
6
  nodes.forEach((node) => node.remove());
@@ -18,7 +19,7 @@ const SlotCarrier: React.FC<SlotCarrierProps> = ({ nodes }) => {
18
19
  }, [nodes]);
19
20
 
20
21
  if (nodes.length) {
21
- return <slot ref={host} />;
22
+ return <piral-slot ref={host} />;
22
23
  }
23
24
 
24
25
  return null;
package/src/utils/foreign.test.ts CHANGED
@@ -14,8 +14,8 @@ describe('Util Foreign.', () => {
14
14
  const context = {
15
15
  updatePortal: jest.fn(),
16
16
  } as any;
17
- const portalId = 'data-portal-id';
18
- const element = document.createElement('div') as HTMLDivElement;
17
+ const portalId = 'pid';
18
+ const element = document.createElement('piral-portal') as HTMLElement;
19
19
  element.setAttribute(portalId, '100');
20
20
 
21
21
  const result = changeDomPortal(portalId, current, context, element, DefaultLoadingIndicator, {});
@@ -43,8 +43,8 @@ describe('Util Foreign.', () => {
43
43
  const context = {
44
44
  showPortal: jest.fn(),
45
45
  } as any;
46
- const portalId = 'data-portal-id';
47
- const element = document.createElement('div') as HTMLDivElement;
46
+ const portalId = 'pid';
47
+ const element = document.createElement('piral-portal') as HTMLElement;
48
48
  element.setAttribute(portalId, '100');
49
49
  var [result] = renderInDom(context, element, DefaultLoadingIndicator, {});
50
50
  expect(result).toBe('100');
@@ -54,7 +54,7 @@ describe('Util Foreign.', () => {
54
54
  const context = {
55
55
  showPortal: jest.fn(),
56
56
  } as any;
57
- const element = document.createElement('div') as HTMLDivElement;
57
+ const element = document.createElement('piral-portal') as HTMLElement;
58
58
  var [result] = renderInDom(context, element, DefaultLoadingIndicator, {});
59
59
  expect(result).toBe('root');
60
60
  });
package/src/utils/foreign.ts CHANGED
@@ -2,6 +2,10 @@ import { createElement, ComponentType, ReactPortal } from 'react';
2
2
  import { createPortal } from 'react-dom';
3
3
  import { GlobalStateContext, ForeignComponent } from '../types';
4
4
 
5
+ export const extensionName = 'piral-extension';
6
+ export const portalName = 'piral-portal';
7
+ export const slotName = 'piral-slot';
8
+
5
9
  export function attachDomPortal<TProps>(
6
10
  id: string,
7
11
  context: GlobalStateContext,
@@ -44,11 +48,11 @@ export function renderInDom<TProps>(
44
48
  component: ComponentType<TProps>,
45
49
  props: TProps,
46
50
  ) {
47
- const portalId = 'data-portal-id';
51
+ const portalId = 'pid';
48
52
  let parent: Node = element;
49
53
 
50
54
  while (parent) {
51
- if (parent instanceof Element && parent.hasAttribute(portalId)) {
55
+ if (parent instanceof Element && parent.localName === portalName && parent.hasAttribute(portalId)) {
52
56
  const id = parent.getAttribute(portalId);
53
57
  return attachDomPortal(id, context, element, component, props);
54
58
  }