sample-piral 0.14.8-beta.3509 → 0.14.8-beta.3515

package/app/{index.e6e3cd.js → index.ae1835.js}

@@ -1812,8 +1812,10 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony import */ var _createInstance__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./createInstance */ "../../framework/piral-core/esm/createInstance.js");
 /* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components */ "../../framework/piral-core/esm/components/ResponsiveLayout.js");
 /* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components */ "../../framework/piral-core/esm/components/Mediator.js");
-/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./components */ "../../framework/piral-core/esm/components/PiralView.js");
-/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./components */ "../../framework/piral-core/esm/components/PortalRenderer.js");
+/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./components */ "../../framework/piral-core/esm/components/PiralView.js");
+/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./components */ "../../framework/piral-core/esm/components/PortalRenderer.js");
+/* harmony import */ var _RootListener__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./RootListener */ "../../framework/piral-core/esm/RootListener.js");
+
 
 
 
@@ -1846,7 +1848,7 @@ var Piral = function Piral(_ref) {
   }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components__WEBPACK_IMPORTED_MODULE_4__.Mediator, {
     options: instance.options,
     key: instance.id
-  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components__WEBPACK_IMPORTED_MODULE_5__.PiralView, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components__WEBPACK_IMPORTED_MODULE_6__.PortalRenderer, {
+  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_RootListener__WEBPACK_IMPORTED_MODULE_5__.RootListener, null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components__WEBPACK_IMPORTED_MODULE_6__.PiralView, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(_components__WEBPACK_IMPORTED_MODULE_7__.PortalRenderer, {
     id: "root"
   }), children));
 };
@@ -1854,6 +1856,65 @@ Piral.displayName = 'Piral';
 
 /***/ }),
 
+/***/ "../../framework/piral-core/esm/RootListener.js":
+/*!******************************************************!*\
+  !*** ../../framework/piral-core/esm/RootListener.js ***!
+  \******************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "RootListener": () => (/* binding */ RootListener)
+/* harmony export */ });
+/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "../../../node_modules/react/index.js");
+/* harmony import */ var ___WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! . */ "../../framework/piral-core/esm/hooks/globalState.js");
+/* harmony import */ var _modules__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./modules */ "../../framework/piral-core/esm/modules/element.js");
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+
+
+
+var RootListener = function RootListener() {
+  var context = (0,___WEBPACK_IMPORTED_MODULE_1__.useGlobalStateContext)();
+  react__WEBPACK_IMPORTED_MODULE_0__.useLayoutEffect(function () {
+    if (typeof document !== 'undefined') {
+      var handler = function handler(ev) {
+        ev.stopPropagation();
+        var _ev$detail = ev.detail,
+            target = _ev$detail.target,
+            props = _ev$detail.props;
+
+        var _renderElement = (0,_modules__WEBPACK_IMPORTED_MODULE_2__.renderElement)(context, target, props),
+            _renderElement2 = _slicedToArray(_renderElement, 2),
+            dispose = _renderElement2[0],
+            update = _renderElement2[1];
+
+        target.dispose = dispose;
+        target.update = update;
+      };
+
+      document.body.addEventListener('render-html', handler, false);
+      return function () {
+        document.body.removeEventListener('render-html', handler, false);
+      };
+    }
+  }, [context]);
+  return null;
+};
+
+/***/ }),
+
 /***/ "../../framework/piral-core/esm/actions/app.js":
 /*!*****************************************************!*\
   !*** ../../framework/piral-core/esm/actions/app.js ***!
@@ -2428,7 +2489,8 @@ function ExtensionSlot(props) {
       _props$render = props.render,
       render = _props$render === void 0 ? _utils__WEBPACK_IMPORTED_MODULE_1__.defaultRender : _props$render,
       empty = props.empty,
-      params = props.params;
+      params = props.params,
+      children = props.children;
   var extensions = (0,_hooks__WEBPACK_IMPORTED_MODULE_2__.useGlobalState)(function (s) {
     return s.registry.extensions[name] || _utils__WEBPACK_IMPORTED_MODULE_3__.none;
   });
@@ -2439,6 +2501,7 @@ function ExtensionSlot(props) {
         defaults = _ref$defaults === void 0 ? {} : _ref$defaults;
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component, {
       key: "".concat((reference === null || reference === void 0 ? void 0 : reference.displayName) || '_').concat(i),
+      children: children,
       params: Object.assign(Object.assign({}, defaults), params || {})
     });
   }));
@@ -3222,7 +3285,7 @@ function createInstance() {
   var createApi = apiFactory(context, usedPlugins);
   var root = createApi({
     name: 'root',
-    version: "0.14.8-beta.3509" || 0,
+    version: "0.14.8-beta.3515" || 0,
     spec: ''
   });
   var options = (0,_helpers__WEBPACK_IMPORTED_MODULE_6__.createPiletOptions)({
@@ -3638,6 +3701,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "noop": () => (/* reexport safe */ _utils__WEBPACK_IMPORTED_MODULE_6__.noop),
 /* harmony export */   "prependItem": () => (/* reexport safe */ _utils__WEBPACK_IMPORTED_MODULE_6__.prependItem),
 /* harmony export */   "prependItems": () => (/* reexport safe */ _utils__WEBPACK_IMPORTED_MODULE_6__.prependItems),
+/* harmony export */   "reactifyContent": () => (/* reexport safe */ _utils__WEBPACK_IMPORTED_MODULE_6__.reactifyContent),
 /* harmony export */   "removeIndicator": () => (/* reexport safe */ _utils__WEBPACK_IMPORTED_MODULE_6__.removeIndicator),
 /* harmony export */   "removeNested": () => (/* reexport safe */ _utils__WEBPACK_IMPORTED_MODULE_6__.removeNested),
 /* harmony export */   "renderInDom": () => (/* reexport safe */ _utils__WEBPACK_IMPORTED_MODULE_6__.renderInDom),
@@ -3684,27 +3748,227 @@ __webpack_require__.r(__webpack_exports__);
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "createCoreApi": () => (/* binding */ createCoreApi),
 /* harmony export */   "createExtenders": () => (/* binding */ createExtenders),
 /* harmony export */   "defaultApiFactory": () => (/* binding */ defaultApiFactory)
 /* harmony export */ });
-/* harmony import */ var piral_base__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! piral-base */ "../../framework/piral-base/esm/utils.js");
-/* harmony import */ var piral_base__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! piral-base */ "../../framework/piral-base/esm/api.js");
-/* harmony import */ var _state__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../state */ "../../framework/piral-core/esm/state/withApi.js");
-/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../components */ "../../framework/piral-core/esm/components/ExtensionSlot.js");
-/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils */ "../../framework/piral-core/esm/utils/helpers.js");
-/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils */ "../../framework/piral-core/esm/utils/foreign.js");
-/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../utils */ "../../framework/piral-core/esm/utils/data.js");
-function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
-
+/* harmony import */ var piral_base__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! piral-base */ "../../framework/piral-base/esm/utils.js");
+/* harmony import */ var piral_base__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! piral-base */ "../../framework/piral-base/esm/api.js");
+/* harmony import */ var _core__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./core */ "../../framework/piral-core/esm/modules/core.js");
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
 
 function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
 
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
 function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
 
 function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
 
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+
+
+function createExtenders(context, apis) {
+  var creators = [_core__WEBPACK_IMPORTED_MODULE_0__.createCoreApi].concat(_toConsumableArray(apis.filter(piral_base__WEBPACK_IMPORTED_MODULE_1__.isfunc)));
+  return creators.map(function (c) {
+    var ctx = c(context);
+
+    if ((0,piral_base__WEBPACK_IMPORTED_MODULE_1__.isfunc)(ctx)) {
+      return ctx;
+    } else {
+      return function () {
+        return Object.assign({}, ctx);
+      };
+    }
+  });
+}
+function defaultApiFactory(context, apis) {
+  var extenders = createExtenders(context, apis);
+  return function (target) {
+    var api = (0,piral_base__WEBPACK_IMPORTED_MODULE_2__.initializeApi)(target, context);
+    context.apis[target.name] = api;
+    return (0,piral_base__WEBPACK_IMPORTED_MODULE_2__.mergeApis)(api, extenders, target);
+  };
+}
+
+/***/ }),
+
+/***/ "../../framework/piral-core/esm/modules/core.js":
+/*!******************************************************!*\
+  !*** ../../framework/piral-core/esm/modules/core.js ***!
+  \******************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "createCoreApi": () => (/* binding */ createCoreApi)
+/* harmony export */ });
+/* harmony import */ var _element__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./element */ "../../framework/piral-core/esm/modules/element.js");
+/* harmony import */ var _state__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../state */ "../../framework/piral-core/esm/state/withApi.js");
+/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../components */ "../../framework/piral-core/esm/components/ExtensionSlot.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils */ "../../framework/piral-core/esm/utils/data.js");
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+function _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== "undefined" && arr[Symbol.iterator] || arr["@@iterator"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
+
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+
+
+
+
+
+function createCoreApi(context) {
+  return function (api, meta) {
+    var pilet = meta.name;
+    return {
+      getData: function getData(name) {
+        return context.readDataValue(name);
+      },
+      setData: function setData(name, value, options) {
+        var _createDataOptions = (0,_utils__WEBPACK_IMPORTED_MODULE_0__.createDataOptions)(options),
+            _createDataOptions$ta = _createDataOptions.target,
+            target = _createDataOptions$ta === void 0 ? 'memory' : _createDataOptions$ta,
+            expires = _createDataOptions.expires;
+
+        var expiration = (0,_utils__WEBPACK_IMPORTED_MODULE_0__.getDataExpiration)(expires);
+        return context.tryWriteDataItem(name, value, pilet, target, expiration);
+      },
+      registerPage: function registerPage(route, arg, meta) {
+        context.registerPage(route, {
+          pilet: pilet,
+          meta: meta,
+          component: (0,_state__WEBPACK_IMPORTED_MODULE_1__.withApi)(context, arg, api, 'page')
+        });
+        return function () {
+          return api.unregisterPage(route);
+        };
+      },
+      unregisterPage: function unregisterPage(route) {
+        context.unregisterPage(route);
+      },
+      registerExtension: function registerExtension(name, arg, defaults) {
+        context.registerExtension(name, {
+          pilet: pilet,
+          component: (0,_state__WEBPACK_IMPORTED_MODULE_1__.withApi)(context, arg, api, 'extension'),
+          reference: arg,
+          defaults: defaults
+        });
+        return function () {
+          return api.unregisterExtension(name, arg);
+        };
+      },
+      unregisterExtension: function unregisterExtension(name, arg) {
+        context.unregisterExtension(name, arg);
+      },
+      renderHtmlExtension: function renderHtmlExtension(element, props) {
+        var _renderElement = (0,_element__WEBPACK_IMPORTED_MODULE_2__.renderElement)(context, element, props),
+            _renderElement2 = _slicedToArray(_renderElement, 1),
+            dispose = _renderElement2[0];
+
+        return dispose;
+      },
+      Extension: _components__WEBPACK_IMPORTED_MODULE_3__.ExtensionSlot
+    };
+  };
+}
+
+/***/ }),
+
+/***/ "../../framework/piral-core/esm/modules/dependencies.js":
+/*!**************************************************************!*\
+  !*** ../../framework/piral-core/esm/modules/dependencies.js ***!
+  \**************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "globalDependencies": () => (/* binding */ globalDependencies),
+/* harmony export */   "defaultDependencySelector": () => (/* binding */ defaultDependencySelector),
+/* harmony export */   "defaultModuleRequester": () => (/* binding */ defaultModuleRequester)
+/* harmony export */ });
+/* harmony import */ var piral_base__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! piral-base */ "../../framework/piral-base/esm/utils.js");
+/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! tslib */ "../../../node_modules/tslib/tslib.es6.js");
+
+
+/**
+ * The global dependencies, which represent the dependencies
+ * shared from the app shell itself.
+ */
+
+var globalDependencies = {};
+
+if (true) {
+  var fillDependencies = __webpack_require__(/*! ../../dependencies.codegen */ "../../framework/piral-core/dependencies.codegen");
+
+  if ((0,piral_base__WEBPACK_IMPORTED_MODULE_0__.isfunc)(fillDependencies)) {
+    fillDependencies(globalDependencies);
+  } else {
+    // fall back to the default list if the codegen is invalid / not supported
+    (0,tslib__WEBPACK_IMPORTED_MODULE_1__.__assign)(globalDependencies, {
+      react: __webpack_require__(/*! react */ "../../../node_modules/react/index.js"),
+      'react-dom': __webpack_require__(/*! react-dom */ "../../../node_modules/react-dom/index.js"),
+      'react-router': __webpack_require__(/*! react-router */ "../../../node_modules/react-router/esm/react-router.js"),
+      'react-router-dom': __webpack_require__(/*! react-router-dom */ "../../../node_modules/react-router-dom/esm/react-router-dom.js"),
+      history: __webpack_require__(/*! history */ "../../../node_modules/history/esm/history.js"),
+      tslib: __webpack_require__(/*! tslib */ "../../../node_modules/tslib/tslib.es6.js"),
+      'path-to-regexp': __webpack_require__(/*! path-to-regexp */ "../../../node_modules/path-to-regexp/index.js"),
+      '@libre/atom': __webpack_require__(/*! @libre/atom */ "../../../node_modules/@libre/atom/dist/index.esm.js"),
+      '@dbeining/react-atom': __webpack_require__(/*! @dbeining/react-atom */ "../../../node_modules/@dbeining/react-atom/dist/react-atom.js")
+    });
+  }
+} else {}
+/**
+ * The default dependency selector, which just returns the provided
+ * dependencies.
+ */
+
+
+function defaultDependencySelector(dependencies) {
+  return dependencies;
+}
+/**
+ * The default pilet requester, which just returns an empty array.
+ * Use your own code to connect to the feed service.
+ *
+ * @example
+```js
+return fetch('https://feed.piral.cloud/api/v1/pilet/sample')
+  .then(res => res.json())
+  .then(res => res.items);
+```
+ */
+
+function defaultModuleRequester() {
+  return Promise.resolve([]);
+}
+
+/***/ }),
+
+/***/ "../../framework/piral-core/esm/modules/element.js":
+/*!*********************************************************!*\
+  !*** ../../framework/piral-core/esm/modules/element.js ***!
+  \*********************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+__webpack_require__.r(__webpack_exports__);
+/* harmony export */ __webpack_require__.d(__webpack_exports__, {
+/* harmony export */   "renderElement": () => (/* binding */ renderElement)
+/* harmony export */ });
+/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../components */ "../../framework/piral-core/esm/components/ExtensionSlot.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../utils */ "../../framework/piral-core/esm/utils/helpers.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../utils */ "../../framework/piral-core/esm/utils/extension.js");
+/* harmony import */ var _utils__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../utils */ "../../framework/piral-core/esm/utils/foreign.js");
+function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
 function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
 
 function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
@@ -3746,8 +4010,6 @@ function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.g
 
 
 
-
-
 if (typeof window !== 'undefined' && 'customElements' in window) {
   var PiralExtension = /*#__PURE__*/function (_HTMLElement) {
     _inherits(PiralExtension, _HTMLElement);
@@ -3765,7 +4027,8 @@ if (typeof window !== 'undefined' && 'customElements' in window) {
       _this.props = {
         name: _this.getAttribute('name'),
         params: (0,_utils__WEBPACK_IMPORTED_MODULE_0__.tryParseJson)(_this.getAttribute('params')),
-        empty: undefined
+        empty: undefined,
+        children: (0,_utils__WEBPACK_IMPORTED_MODULE_1__.reactifyContent)(_this.childNodes)
       };
       return _this;
     }
@@ -3843,8 +4106,8 @@ if (typeof window !== 'undefined' && 'customElements' in window) {
   customElements.define('piral-extension', PiralExtension);
 }
 
-function render(context, element, props) {
-  var _renderInDom = (0,_utils__WEBPACK_IMPORTED_MODULE_1__.renderInDom)(context, element, _components__WEBPACK_IMPORTED_MODULE_2__.ExtensionSlot, props),
+function renderElement(context, element, props) {
+  var _renderInDom = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.renderInDom)(context, element, _components__WEBPACK_IMPORTED_MODULE_3__.ExtensionSlot, props),
       _renderInDom2 = _slicedToArray(_renderInDom, 2),
       id = _renderInDom2[0],
       portal = _renderInDom2[1];
@@ -3861,7 +4124,7 @@ function render(context, element, props) {
   };
 
   var update = function update(newProps) {
-    var _changeDomPortal = (0,_utils__WEBPACK_IMPORTED_MODULE_1__.changeDomPortal)(id, portal, context, element, _components__WEBPACK_IMPORTED_MODULE_2__.ExtensionSlot, newProps);
+    var _changeDomPortal = (0,_utils__WEBPACK_IMPORTED_MODULE_2__.changeDomPortal)(id, portal, context, element, _components__WEBPACK_IMPORTED_MODULE_3__.ExtensionSlot, newProps);
 
     var _changeDomPortal2 = _slicedToArray(_changeDomPortal, 2);
 
@@ -3873,169 +4136,6 @@ function render(context, element, props) {
   return [dispose, update];
 }
 
-function createCoreApi(context) {
-  if (typeof document !== 'undefined') {
-    document.body.addEventListener('render-html', function (ev) {
-      ev.stopPropagation();
-      var container = ev.detail.target;
-
-      var _render = render(context, container, ev.detail.props),
-          _render2 = _slicedToArray(_render, 2),
-          dispose = _render2[0],
-          update = _render2[1];
-
-      container.dispose = dispose;
-      container.update = update;
-    }, false);
-  }
-
-  return function (api, target) {
-    var pilet = target.name;
-    return {
-      getData: function getData(name) {
-        return context.readDataValue(name);
-      },
-      setData: function setData(name, value, options) {
-        var _createDataOptions = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.createDataOptions)(options),
-            _createDataOptions$ta = _createDataOptions.target,
-            target = _createDataOptions$ta === void 0 ? 'memory' : _createDataOptions$ta,
-            expires = _createDataOptions.expires;
-
-        var expiration = (0,_utils__WEBPACK_IMPORTED_MODULE_3__.getDataExpiration)(expires);
-        return context.tryWriteDataItem(name, value, pilet, target, expiration);
-      },
-      registerPage: function registerPage(route, arg, meta) {
-        context.registerPage(route, {
-          pilet: pilet,
-          meta: meta,
-          component: (0,_state__WEBPACK_IMPORTED_MODULE_4__.withApi)(context, arg, api, 'page')
-        });
-        return function () {
-          return api.unregisterPage(route);
-        };
-      },
-      unregisterPage: function unregisterPage(route) {
-        context.unregisterPage(route);
-      },
-      registerExtension: function registerExtension(name, arg, defaults) {
-        context.registerExtension(name, {
-          pilet: pilet,
-          component: (0,_state__WEBPACK_IMPORTED_MODULE_4__.withApi)(context, arg, api, 'extension'),
-          reference: arg,
-          defaults: defaults
-        });
-        return function () {
-          return api.unregisterExtension(name, arg);
-        };
-      },
-      unregisterExtension: function unregisterExtension(name, arg) {
-        context.unregisterExtension(name, arg);
-      },
-      renderHtmlExtension: function renderHtmlExtension(element, props) {
-        var _render3 = render(context, element, props),
-            _render4 = _slicedToArray(_render3, 1),
-            dispose = _render4[0];
-
-        return dispose;
-      },
-      Extension: _components__WEBPACK_IMPORTED_MODULE_2__.ExtensionSlot
-    };
-  };
-}
-function createExtenders(context, apis) {
-  var creators = [createCoreApi].concat(_toConsumableArray(apis.filter(piral_base__WEBPACK_IMPORTED_MODULE_5__.isfunc)));
-  return creators.map(function (c) {
-    var ctx = c(context);
-
-    if ((0,piral_base__WEBPACK_IMPORTED_MODULE_5__.isfunc)(ctx)) {
-      return ctx;
-    } else {
-      return function () {
-        return Object.assign({}, ctx);
-      };
-    }
-  });
-}
-function defaultApiFactory(context, apis) {
-  var extenders = createExtenders(context, apis);
-  return function (target) {
-    var api = (0,piral_base__WEBPACK_IMPORTED_MODULE_6__.initializeApi)(target, context);
-    context.apis[target.name] = api;
-    return (0,piral_base__WEBPACK_IMPORTED_MODULE_6__.mergeApis)(api, extenders, target);
-  };
-}
-
-/***/ }),
-
-/***/ "../../framework/piral-core/esm/modules/dependencies.js":
-/*!**************************************************************!*\
-  !*** ../../framework/piral-core/esm/modules/dependencies.js ***!
-  \**************************************************************/
-/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
-
-"use strict";
-__webpack_require__.r(__webpack_exports__);
-/* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "globalDependencies": () => (/* binding */ globalDependencies),
-/* harmony export */   "defaultDependencySelector": () => (/* binding */ defaultDependencySelector),
-/* harmony export */   "defaultModuleRequester": () => (/* binding */ defaultModuleRequester)
-/* harmony export */ });
-/* harmony import */ var piral_base__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! piral-base */ "../../framework/piral-base/esm/utils.js");
-/* harmony import */ var tslib__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! tslib */ "../../../node_modules/tslib/tslib.es6.js");
-
-
-/**
- * The global dependencies, which represent the dependencies
- * shared from the app shell itself.
- */
-
-var globalDependencies = {};
-
-if (true) {
-  var fillDependencies = __webpack_require__(/*! ../../dependencies.codegen */ "../../framework/piral-core/dependencies.codegen");
-
-  if ((0,piral_base__WEBPACK_IMPORTED_MODULE_0__.isfunc)(fillDependencies)) {
-    fillDependencies(globalDependencies);
-  } else {
-    // fall back to the default list if the codegen is invalid / not supported
-    (0,tslib__WEBPACK_IMPORTED_MODULE_1__.__assign)(globalDependencies, {
-      react: __webpack_require__(/*! react */ "../../../node_modules/react/index.js"),
-      'react-dom': __webpack_require__(/*! react-dom */ "../../../node_modules/react-dom/index.js"),
-      'react-router': __webpack_require__(/*! react-router */ "../../../node_modules/react-router/esm/react-router.js"),
-      'react-router-dom': __webpack_require__(/*! react-router-dom */ "../../../node_modules/react-router-dom/esm/react-router-dom.js"),
-      history: __webpack_require__(/*! history */ "../../../node_modules/history/esm/history.js"),
-      tslib: __webpack_require__(/*! tslib */ "../../../node_modules/tslib/tslib.es6.js"),
-      'path-to-regexp': __webpack_require__(/*! path-to-regexp */ "../../../node_modules/path-to-regexp/index.js"),
-      '@libre/atom': __webpack_require__(/*! @libre/atom */ "../../../node_modules/@libre/atom/dist/index.esm.js"),
-      '@dbeining/react-atom': __webpack_require__(/*! @dbeining/react-atom */ "../../../node_modules/@dbeining/react-atom/dist/react-atom.js")
-    });
-  }
-} else {}
-/**
- * The default dependency selector, which just returns the provided
- * dependencies.
- */
-
-
-function defaultDependencySelector(dependencies) {
-  return dependencies;
-}
-/**
- * The default pilet requester, which just returns an empty array.
- * Use your own code to connect to the feed service.
- *
- * @example
-```js
-return fetch('https://feed.piral.cloud/api/v1/pilet/sample')
-  .then(res => res.json())
-  .then(res => res.items);
-```
- */
-
-function defaultModuleRequester() {
-  return Promise.resolve([]);
-}
-
 /***/ }),
 
 /***/ "../../framework/piral-core/esm/state/createActions.js":
@@ -4558,15 +4658,79 @@ function getDataExpiration(expires) {
 "use strict";
 __webpack_require__.r(__webpack_exports__);
 /* harmony export */ __webpack_require__.d(__webpack_exports__, {
-/* harmony export */   "toExtension": () => (/* binding */ toExtension)
+/* harmony export */   "toExtension": () => (/* binding */ toExtension),
+/* harmony export */   "reactifyContent": () => (/* binding */ reactifyContent)
 /* harmony export */ });
 /* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ "../../../node_modules/react/index.js");
+function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
+
+function _nonIterableSpread() { throw new TypeError("Invalid attempt to spread non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+
+function _iterableToArray(iter) { if (typeof Symbol !== "undefined" && iter[Symbol.iterator] != null || iter["@@iterator"] != null) return Array.from(iter); }
+
+function _arrayWithoutHoles(arr) { if (Array.isArray(arr)) return _arrayLikeToArray(arr); }
+
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }
+
+
+
+function removeAll(nodes) {
+  nodes.forEach(function (node) {
+    return node.remove();
+  });
+}
+
+var SlotCarrier = function SlotCarrier(_ref) {
+  var nodes = _ref.nodes;
+  var host = react__WEBPACK_IMPORTED_MODULE_0__.useRef();
+  react__WEBPACK_IMPORTED_MODULE_0__.useEffect(function () {
+    var _a2;
+
+    var _a;
+
+    (_a = host.current) === null || _a === void 0 ? void 0 : (_a2 = _a).append.apply(_a2, _toConsumableArray(nodes));
+    return function () {
+      return removeAll(nodes);
+    };
+  }, [nodes]);
+
+  if (nodes.length) {
+    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement("slot", {
+      ref: host
+    });
+  }
+
+  return null;
+};
+/**
+ * Transforms the given component to an extension component.
+ * @param Component The component to transform.
+ * @returns The extension component (receiving its props via params).
+ */
+
 
 function toExtension(Component) {
   return function (props) {
     return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(Component, Object.assign({}, props.params));
   };
 }
+/**
+ * Reactifies the list of child nodes to a React Node by removing the
+ * nodes from the DOM and carrying it in a React Node, where it would be
+ * attached at a slot.
+ * @param childNodes The child nodes to reactify.
+ * @returns The React Node.
+ */
+
+function reactifyContent(childNodes) {
+  var nodes = Array.prototype.filter.call(childNodes, Boolean);
+  removeAll(nodes);
+  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0__.createElement(SlotCarrier, {
+    nodes: nodes
+  });
+}
 
 /***/ }),
 
@@ -4792,6 +4956,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "createDataOptions": () => (/* reexport safe */ _data__WEBPACK_IMPORTED_MODULE_1__.createDataOptions),
 /* harmony export */   "createDataView": () => (/* reexport safe */ _data__WEBPACK_IMPORTED_MODULE_1__.createDataView),
 /* harmony export */   "getDataExpiration": () => (/* reexport safe */ _data__WEBPACK_IMPORTED_MODULE_1__.getDataExpiration),
+/* harmony export */   "reactifyContent": () => (/* reexport safe */ _extension__WEBPACK_IMPORTED_MODULE_2__.reactifyContent),
 /* harmony export */   "toExtension": () => (/* reexport safe */ _extension__WEBPACK_IMPORTED_MODULE_2__.toExtension),
 /* harmony export */   "attachDomPortal": () => (/* reexport safe */ _foreign__WEBPACK_IMPORTED_MODULE_3__.attachDomPortal),
 /* harmony export */   "changeDomPortal": () => (/* reexport safe */ _foreign__WEBPACK_IMPORTED_MODULE_3__.changeDomPortal),
@@ -5487,6 +5652,7 @@ __webpack_require__.r(__webpack_exports__);
 /* harmony export */   "noop": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.noop),
 /* harmony export */   "prependItem": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.prependItem),
 /* harmony export */   "prependItems": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.prependItems),
+/* harmony export */   "reactifyContent": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.reactifyContent),
 /* harmony export */   "removeIndicator": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.removeIndicator),
 /* harmony export */   "removeNested": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.removeNested),
 /* harmony export */   "renderInDom": () => (/* reexport safe */ piral_core__WEBPACK_IMPORTED_MODULE_0__.renderInDom),
@@ -9058,11 +9224,11 @@ function installPiralDebug(options) {
     debug: debugApiVersion,
     instance: {
       name: "sample-piral",
-      version: "0.14.8-beta.3509",
+      version: "0.14.8-beta.3515",
       dependencies: "reactstrap,react,react-dom,react-router,react-router-dom,history,tslib,path-to-regexp,@libre/atom,@dbeining/react-atom"
     },
     build: {
-      date: "2022-01-19T08:52:54.958Z",
+      date: "2022-01-20T12:13:17.502Z",
       cli: "0.14.7",
       compat: "0.14"
     },
@@ -80367,4 +80533,4 @@ var layout_1 = __webpack_require__(/*! ./layout */ "./src/layout.tsx");
 
 /******/ })()
 ;
-//# sourceMappingURL=index.e6e3cd.js.map
+//# sourceMappingURL=index.ae1835.js.map