piral-hyperapp 0.13.9 → 0.14.0-beta.3157

package/convert.d.ts

@@ -1,9 +1,11 @@
 import type { HtmlComponent } from 'piral-core';
-import { createExtension } from './lib/extension';
-declare const convert: <TProps extends import("piral-core").BaseComponentProps>(root: import("./lib/types").Component<TProps, {}, {}>, state: any, actions: any) => import("piral-core").ForeignComponent<TProps>;
+import { createConverter } from './lib/converter';
 export interface HyperappConverter {
-    (...params: Parameters<typeof convert>): HtmlComponent<any>;
+    (...params: Parameters<ReturnType<typeof createConverter>>): HtmlComponent<any>;
 }
-export declare const fromHyperapp: HyperappConverter;
-export declare const createHyperappExtension: typeof createExtension;
-export {};
+export declare function createHyperappConverter(...params: Parameters<typeof createConverter>): {
+    from: HyperappConverter;
+    Extension: import("./lib/types").Component<import("piral-core").ExtensionSlotProps<string>, {}, {}>;
+};
+declare const fromHyperapp: HyperappConverter, HyperExtension: import("./lib/types").Component<import("piral-core").ExtensionSlotProps<string>, {}, {}>;
+export { fromHyperapp, HyperExtension };

package/convert.js

@@ -1,12 +1,21 @@
 "use strict";
 exports.__esModule = true;
-exports.createHyperappExtension = exports.fromHyperapp = void 0;
+exports.HyperExtension = exports.fromHyperapp = exports.createHyperappConverter = void 0;
 var converter_1 = require("./lib/converter");
-var extension_1 = require("./lib/extension");
-var convert = converter_1.createConverter();
-var fromHyperapp = function (root, state, actions) { return ({
-    type: 'html',
-    component: convert(root, state, actions)
-}); };
+function createHyperappConverter() {
+    var params = [];
+    for (var _i = 0; _i < arguments.length; _i++) {
+        params[_i] = arguments[_i];
+    }
+    var convert = converter_1.createConverter.apply(void 0, params);
+    var Extension = convert.Extension;
+    var from = function (root, state, actions) { return ({
+        type: 'html',
+        component: convert(root, state, actions)
+    }); };
+    return { from: from, Extension: Extension };
+}
+exports.createHyperappConverter = createHyperappConverter;
+var _a = createHyperappConverter(), fromHyperapp = _a.from, HyperExtension = _a.Extension;
 exports.fromHyperapp = fromHyperapp;
-exports.createHyperappExtension = extension_1.createExtension;
+exports.HyperExtension = HyperExtension;

package/esm/converter.d.ts

@@ -1,3 +1,13 @@
-import { ForeignComponent, BaseComponentProps } from 'piral-core';
-import { Component } from './types';
-export declare function createConverter(): <TProps extends BaseComponentProps>(root: Component<TProps, {}, {}>, state: any, actions: any) => ForeignComponent<TProps>;
+import type { ForeignComponent, BaseComponentProps } from 'piral-core';
+import type { Component } from './types';
+export interface HyperappConverterOptions {
+    /**
+     * Defines the name of the root element.
+     * @default slot
+     */
+    rootName?: string;
+}
+export declare function createConverter(config?: HyperappConverterOptions): {
+    <TProps extends BaseComponentProps>(root: Component<TProps, {}, {}>, state: any, actions: any): ForeignComponent<TProps>;
+    Extension: Component<import("piral-core").ExtensionSlotProps<string>, {}, {}>;
+};

package/esm/converter.js

@@ -1,15 +1,19 @@
 import { mountHyperapp } from './mount';
-export function createConverter() {
-    var convert = function (root, state, actions) {
+import { createExtension } from './extension';
+export function createConverter(config = {}) {
+    const { rootName = 'slot' } = config;
+    const Extension = createExtension(rootName);
+    const convert = (root, state, actions) => {
         return {
-            mount: function (el, props, ctx) {
+            mount(el, props, ctx) {
                 mountHyperapp(el, root, props, ctx, state, actions);
             },
-            unmount: function (el) {
+            unmount(el) {
                 el.innerHTML = '';
             },
         };
     };
+    convert.Extension = Extension;
     return convert;
 }
 //# sourceMappingURL=converter.js.map

package/esm/converter.js.map

@@ -1 +1 @@
-{"version":3,"file":"converter.js","sourceRoot":"","sources":["../src/converter.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AAGxC,MAAM,UAAU,eAAe;IAC7B,IAAM,OAAO,GAAG,UACd,IAAuB,EACvB,KAAU,EACV,OAAY;QAEZ,OAAO;YACL,KAAK,YAAC,EAAE,EAAE,KAAK,EAAE,GAAG;gBAClB,aAAa,CAAC,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;YACtD,CAAC;YACD,OAAO,YAAC,EAAE;gBACR,EAAE,CAAC,SAAS,GAAG,EAAE,CAAC;YACpB,CAAC;SACF,CAAC;IACJ,CAAC,CAAC;IACF,OAAO,OAAO,CAAC;AACjB,CAAC"}
+{"version":3,"file":"converter.js","sourceRoot":"","sources":["../src/converter.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,SAAS,CAAC;AACxC,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAW9C,MAAM,UAAU,eAAe,CAAC,SAAmC,EAAE;IACnE,MAAM,EAAE,QAAQ,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;IACrC,MAAM,SAAS,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IAC5C,MAAM,OAAO,GAAG,CACd,IAAuB,EACvB,KAAU,EACV,OAAY,EACc,EAAE;QAC5B,OAAO;YACL,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG;gBAClB,aAAa,CAAC,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;YACtD,CAAC;YACD,OAAO,CAAC,EAAE;gBACR,EAAE,CAAC,SAAS,GAAG,EAAE,CAAC;YACpB,CAAC;SACF,CAAC;IACJ,CAAC,CAAC;IACF,OAAO,CAAC,SAAS,GAAG,SAAS,CAAC;IAC9B,OAAO,OAAO,CAAC;AACjB,CAAC"}

package/esm/create.d.ts

@@ -1,14 +1,10 @@
 import type { PiralPlugin } from 'piral-core';
+import { HyperappConverterOptions } from './converter';
 import type { PiletHyperappApi } from './types';
 /**
  * Available configuration options for the Hyperapp plugin.
  */
-export interface HyperappConfig {
-    /**
-     * Defines the name of the root element.
-     * @default slot
-     */
-    rootName?: string;
+export interface HyperappConfig extends HyperappConverterOptions {
 }
 /**
  * Creates new Pilet API extensions for the Hyperapp integration.

package/esm/create.js

@@ -1,29 +1,21 @@
 import { createConverter } from './converter';
-import { createExtension } from './extension';
 /**
  * Creates new Pilet API extensions for the Hyperapp integration.
  */
-export function createHyperappApi(config) {
-    if (config === void 0) { config = {}; }
-    var rootName = config.rootName;
-    return function (context) {
-        var convert = createConverter();
-        context.converters.hyperapp = function (_a) {
-            var root = _a.root, state = _a.state, actions = _a.actions;
-            return convert(root, state, actions);
-        };
-        return function (api) {
-            return {
-                fromHyperapp: function (root, state, actions) {
-                    return {
-                        type: 'hyperapp',
-                        root: root,
-                        state: state,
-                        actions: actions,
-                    };
-                },
-                HyperappExtension: createExtension(api, rootName),
-            };
+export function createHyperappApi(config = {}) {
+    return (context) => {
+        const convert = createConverter(config);
+        context.converters.hyperapp = ({ root, state, actions }) => convert(root, state, actions);
+        return {
+            fromHyperapp(root, state, actions) {
+                return {
+                    type: 'hyperapp',
+                    root,
+                    state,
+                    actions,
+                };
+            },
+            HyperappExtension: convert.Extension,
         };
     };
 }

package/esm/create.js.map

@@ -1 +1 @@
-{"version":3,"file":"create.js","sourceRoot":"","sources":["../src/create.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAC9C,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAc9C;;GAEG;AACH,MAAM,UAAU,iBAAiB,CAAC,MAA2B;IAA3B,uBAAA,EAAA,WAA2B;IACnD,IAAA,QAAQ,GAAK,MAAM,SAAX,CAAY;IAE5B,OAAO,UAAC,OAAO;QACb,IAAM,OAAO,GAAG,eAAe,EAAE,CAAC;QAClC,OAAO,CAAC,UAAU,CAAC,QAAQ,GAAG,UAAC,EAAwB;gBAAtB,IAAI,UAAA,EAAE,KAAK,WAAA,EAAE,OAAO,aAAA;YAAO,OAAA,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO,CAAC;QAA7B,CAA6B,CAAC;QAE1F,OAAO,UAAC,GAAG;YACT,OAAO;gBACL,YAAY,YAAC,IAAI,EAAE,KAAK,EAAE,OAAO;oBAC/B,OAAO;wBACL,IAAI,EAAE,UAAU;wBAChB,IAAI,MAAA;wBACJ,KAAK,OAAA;wBACL,OAAO,SAAA;qBACR,CAAC;gBACJ,CAAC;gBACD,iBAAiB,EAAE,eAAe,CAAC,GAAG,EAAE,QAAQ,CAAC;aAClD,CAAC;QACJ,CAAC,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC"}
+{"version":3,"file":"create.js","sourceRoot":"","sources":["../src/create.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,eAAe,EAA4B,MAAM,aAAa,CAAC;AAQxE;;GAEG;AACH,MAAM,UAAU,iBAAiB,CAAC,SAAyB,EAAE;IAC3D,OAAO,CAAC,OAAO,EAAE,EAAE;QACjB,MAAM,OAAO,GAAG,eAAe,CAAC,MAAM,CAAC,CAAC;QACxC,OAAO,CAAC,UAAU,CAAC,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;QAE1F,OAAO;YACL,YAAY,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO;gBAC/B,OAAO;oBACL,IAAI,EAAE,UAAU;oBAChB,IAAI;oBACJ,KAAK;oBACL,OAAO;iBACR,CAAC;YACJ,CAAC;YACD,iBAAiB,EAAE,OAAO,CAAC,SAAS;SACrC,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC"}

package/esm/extension.d.ts

@@ -1,3 +1,3 @@
-import type { PiletApi, ExtensionSlotProps } from 'piral-core';
+import type { ExtensionSlotProps } from 'piral-core';
 import type { Component } from './types';
-export declare function createExtension(api: PiletApi, rootName?: string): Component<ExtensionSlotProps>;
+export declare function createExtension(rootName: string): Component<ExtensionSlotProps>;

package/esm/extension.js

@@ -1,12 +1,15 @@
 import { createHyperappElement } from './mount';
-export function createExtension(api, rootName) {
-    if (rootName === void 0) { rootName = 'slot'; }
-    return function (props) {
-        return createHyperappElement(rootName, {
-            oncreate: function (element) {
-                api.renderHtmlExtension(element, props);
-            },
-        });
-    };
+export function createExtension(rootName) {
+    return (props) => createHyperappElement(rootName, {
+        oncreate(element) {
+            element.dispatchEvent(new CustomEvent('render-html', {
+                bubbles: true,
+                detail: {
+                    target: element,
+                    props,
+                },
+            }));
+        },
+    });
 }
 //# sourceMappingURL=extension.js.map

package/esm/extension.js.map

@@ -1 +1 @@
-{"version":3,"file":"extension.js","sourceRoot":"","sources":["../src/extension.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAGhD,MAAM,UAAU,eAAe,CAAC,GAAa,EAAE,QAAiB;IAAjB,yBAAA,EAAA,iBAAiB;IAC9D,OAAO,UAAC,KAAK;QACX,OAAA,qBAAqB,CAAC,QAAQ,EAAE;YAC9B,QAAQ,EAAR,UAAS,OAAoB;gBAC3B,GAAG,CAAC,mBAAmB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;YAC1C,CAAC;SACF,CAAC;IAJF,CAIE,CAAC;AACP,CAAC"}
+{"version":3,"file":"extension.js","sourceRoot":"","sources":["../src/extension.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,qBAAqB,EAAE,MAAM,SAAS,CAAC;AAGhD,MAAM,UAAU,eAAe,CAAC,QAAgB;IAC9C,OAAO,CAAC,KAAK,EAAE,EAAE,CACf,qBAAqB,CAAC,QAAQ,EAAE;QAC9B,QAAQ,CAAC,OAAoB;YAC3B,OAAO,CAAC,aAAa,CACnB,IAAI,WAAW,CAAC,aAAa,EAAE;gBAC7B,OAAO,EAAE,IAAI;gBACb,MAAM,EAAE;oBACN,MAAM,EAAE,OAAO;oBACf,KAAK;iBACN;aACF,CAAC,CACH,CAAC;QACJ,CAAC;KACF,CAAC,CAAC;AACP,CAAC"}

package/esm/mount.d.ts

@@ -1,3 +1,3 @@
-import { Component } from './types';
+import type { Component } from './types';
 export declare function mountHyperapp<T extends Object>(el: HTMLElement, root: Component<T>, props: T, ctx: any, state: any, actions: any): void;
 export declare function createHyperappElement(name: string, props: any): any;

package/esm/mount.js

@@ -1,7 +1,6 @@
-import { __assign } from "tslib";
-var _a = require('hyperapp'), h = _a.h, app = _a.app;
+const { h, app } = require('hyperapp');
 export function mountHyperapp(el, root, props, ctx, state, actions) {
-    app(__assign(__assign({}, ctx), state), actions, function () { return h(root, props); }, el);
+    app(Object.assign(Object.assign({}, ctx), state), actions, () => h(root, props), el);
 }
 export function createHyperappElement(name, props) {
     return h(name, props, []);

package/esm/mount.js.map

@@ -1 +1 @@
-{"version":3,"file":"mount.js","sourceRoot":"","sources":["../src/mount.ts"],"names":[],"mappings":";AAEM,IAAA,KAAa,OAAO,CAAC,UAAU,CAAC,EAA9B,CAAC,OAAA,EAAE,GAAG,SAAwB,CAAC;AAEvC,MAAM,UAAU,aAAa,CAC3B,EAAe,EACf,IAAkB,EAClB,KAAQ,EACR,GAAQ,EACR,KAAU,EACV,OAAY;IAEZ,GAAG,uBAEI,GAAG,GACH,KAAK,GAEV,OAAO,EACP,cAAM,OAAA,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,EAAd,CAAc,EACpB,EAAE,CACH,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,qBAAqB,CAAC,IAAY,EAAE,KAAU;IAC5D,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;AAC5B,CAAC"}
+{"version":3,"file":"mount.js","sourceRoot":"","sources":["../src/mount.ts"],"names":[],"mappings":"AAEA,MAAM,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;AAEvC,MAAM,UAAU,aAAa,CAC3B,EAAe,EACf,IAAkB,EAClB,KAAQ,EACR,GAAQ,EACR,KAAU,EACV,OAAY;IAEZ,GAAG,iCAEI,GAAG,GACH,KAAK,GAEV,OAAO,EACP,GAAG,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,EACpB,EAAE,CACH,CAAC;AACJ,CAAC;AAED,MAAM,UAAU,qBAAqB,CAAC,IAAY,EAAE,KAAU;IAC5D,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;AAC5B,CAAC"}

package/lib/converter.d.ts

@@ -1,3 +1,13 @@
-import { ForeignComponent, BaseComponentProps } from 'piral-core';
-import { Component } from './types';
-export declare function createConverter(): <TProps extends BaseComponentProps>(root: Component<TProps, {}, {}>, state: any, actions: any) => ForeignComponent<TProps>;
+import type { ForeignComponent, BaseComponentProps } from 'piral-core';
+import type { Component } from './types';
+export interface HyperappConverterOptions {
+    /**
+     * Defines the name of the root element.
+     * @default slot
+     */
+    rootName?: string;
+}
+export declare function createConverter(config?: HyperappConverterOptions): {
+    <TProps extends BaseComponentProps>(root: Component<TProps, {}, {}>, state: any, actions: any): ForeignComponent<TProps>;
+    Extension: Component<import("piral-core").ExtensionSlotProps<string>, {}, {}>;
+};

package/lib/converter.js

@@ -1,18 +1,22 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createConverter = void 0;
-var mount_1 = require("./mount");
-function createConverter() {
-    var convert = function (root, state, actions) {
+const mount_1 = require("./mount");
+const extension_1 = require("./extension");
+function createConverter(config = {}) {
+    const { rootName = 'slot' } = config;
+    const Extension = (0, extension_1.createExtension)(rootName);
+    const convert = (root, state, actions) => {
         return {
-            mount: function (el, props, ctx) {
-                mount_1.mountHyperapp(el, root, props, ctx, state, actions);
+            mount(el, props, ctx) {
+                (0, mount_1.mountHyperapp)(el, root, props, ctx, state, actions);
             },
-            unmount: function (el) {
+            unmount(el) {
                 el.innerHTML = '';
             },
         };
     };
+    convert.Extension = Extension;
     return convert;
 }
 exports.createConverter = createConverter;

package/lib/converter.js.map

@@ -1 +1 @@
-{"version":3,"file":"converter.js","sourceRoot":"","sources":["../src/converter.ts"],"names":[],"mappings":";;;AACA,iCAAwC;AAGxC,SAAgB,eAAe;IAC7B,IAAM,OAAO,GAAG,UACd,IAAuB,EACvB,KAAU,EACV,OAAY;QAEZ,OAAO;YACL,KAAK,YAAC,EAAE,EAAE,KAAK,EAAE,GAAG;gBAClB,qBAAa,CAAC,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;YACtD,CAAC;YACD,OAAO,YAAC,EAAE;gBACR,EAAE,CAAC,SAAS,GAAG,EAAE,CAAC;YACpB,CAAC;SACF,CAAC;IACJ,CAAC,CAAC;IACF,OAAO,OAAO,CAAC;AACjB,CAAC;AAhBD,0CAgBC"}
+{"version":3,"file":"converter.js","sourceRoot":"","sources":["../src/converter.ts"],"names":[],"mappings":";;;AACA,mCAAwC;AACxC,2CAA8C;AAW9C,SAAgB,eAAe,CAAC,SAAmC,EAAE;IACnE,MAAM,EAAE,QAAQ,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;IACrC,MAAM,SAAS,GAAG,IAAA,2BAAe,EAAC,QAAQ,CAAC,CAAC;IAC5C,MAAM,OAAO,GAAG,CACd,IAAuB,EACvB,KAAU,EACV,OAAY,EACc,EAAE;QAC5B,OAAO;YACL,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG;gBAClB,IAAA,qBAAa,EAAC,EAAE,EAAE,IAAI,EAAE,KAAK,EAAE,GAAG,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;YACtD,CAAC;YACD,OAAO,CAAC,EAAE;gBACR,EAAE,CAAC,SAAS,GAAG,EAAE,CAAC;YACpB,CAAC;SACF,CAAC;IACJ,CAAC,CAAC;IACF,OAAO,CAAC,SAAS,GAAG,SAAS,CAAC;IAC9B,OAAO,OAAO,CAAC;AACjB,CAAC;AAnBD,0CAmBC"}

package/lib/create.d.ts

@@ -1,14 +1,10 @@
 import type { PiralPlugin } from 'piral-core';
+import { HyperappConverterOptions } from './converter';
 import type { PiletHyperappApi } from './types';
 /**
  * Available configuration options for the Hyperapp plugin.
  */
-export interface HyperappConfig {
-    /**
-     * Defines the name of the root element.
-     * @default slot
-     */
-    rootName?: string;
+export interface HyperappConfig extends HyperappConverterOptions {
 }
 /**
  * Creates new Pilet API extensions for the Hyperapp integration.

package/lib/create.js

@@ -1,32 +1,24 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createHyperappApi = void 0;
-var converter_1 = require("./converter");
-var extension_1 = require("./extension");
+const converter_1 = require("./converter");
 /**
  * Creates new Pilet API extensions for the Hyperapp integration.
  */
-function createHyperappApi(config) {
-    if (config === void 0) { config = {}; }
-    var rootName = config.rootName;
-    return function (context) {
-        var convert = converter_1.createConverter();
-        context.converters.hyperapp = function (_a) {
-            var root = _a.root, state = _a.state, actions = _a.actions;
-            return convert(root, state, actions);
-        };
-        return function (api) {
-            return {
-                fromHyperapp: function (root, state, actions) {
-                    return {
-                        type: 'hyperapp',
-                        root: root,
-                        state: state,
-                        actions: actions,
-                    };
-                },
-                HyperappExtension: extension_1.createExtension(api, rootName),
-            };
+function createHyperappApi(config = {}) {
+    return (context) => {
+        const convert = (0, converter_1.createConverter)(config);
+        context.converters.hyperapp = ({ root, state, actions }) => convert(root, state, actions);
+        return {
+            fromHyperapp(root, state, actions) {
+                return {
+                    type: 'hyperapp',
+                    root,
+                    state,
+                    actions,
+                };
+            },
+            HyperappExtension: convert.Extension,
         };
     };
 }

package/lib/create.js.map

@@ -1 +1 @@
-{"version":3,"file":"create.js","sourceRoot":"","sources":["../src/create.ts"],"names":[],"mappings":";;;AACA,yCAA8C;AAC9C,yCAA8C;AAc9C;;GAEG;AACH,SAAgB,iBAAiB,CAAC,MAA2B;IAA3B,uBAAA,EAAA,WAA2B;IACnD,IAAA,QAAQ,GAAK,MAAM,SAAX,CAAY;IAE5B,OAAO,UAAC,OAAO;QACb,IAAM,OAAO,GAAG,2BAAe,EAAE,CAAC;QAClC,OAAO,CAAC,UAAU,CAAC,QAAQ,GAAG,UAAC,EAAwB;gBAAtB,IAAI,UAAA,EAAE,KAAK,WAAA,EAAE,OAAO,aAAA;YAAO,OAAA,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO,CAAC;QAA7B,CAA6B,CAAC;QAE1F,OAAO,UAAC,GAAG;YACT,OAAO;gBACL,YAAY,YAAC,IAAI,EAAE,KAAK,EAAE,OAAO;oBAC/B,OAAO;wBACL,IAAI,EAAE,UAAU;wBAChB,IAAI,MAAA;wBACJ,KAAK,OAAA;wBACL,OAAO,SAAA;qBACR,CAAC;gBACJ,CAAC;gBACD,iBAAiB,EAAE,2BAAe,CAAC,GAAG,EAAE,QAAQ,CAAC;aAClD,CAAC;QACJ,CAAC,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC;AArBD,8CAqBC"}
+{"version":3,"file":"create.js","sourceRoot":"","sources":["../src/create.ts"],"names":[],"mappings":";;;AACA,2CAAwE;AAQxE;;GAEG;AACH,SAAgB,iBAAiB,CAAC,SAAyB,EAAE;IAC3D,OAAO,CAAC,OAAO,EAAE,EAAE;QACjB,MAAM,OAAO,GAAG,IAAA,2BAAe,EAAC,MAAM,CAAC,CAAC;QACxC,OAAO,CAAC,UAAU,CAAC,QAAQ,GAAG,CAAC,EAAE,IAAI,EAAE,KAAK,EAAE,OAAO,EAAE,EAAE,EAAE,CAAC,OAAO,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO,CAAC,CAAC;QAE1F,OAAO;YACL,YAAY,CAAC,IAAI,EAAE,KAAK,EAAE,OAAO;gBAC/B,OAAO;oBACL,IAAI,EAAE,UAAU;oBAChB,IAAI;oBACJ,KAAK;oBACL,OAAO;iBACR,CAAC;YACJ,CAAC;YACD,iBAAiB,EAAE,OAAO,CAAC,SAAS;SACrC,CAAC;IACJ,CAAC,CAAC;AACJ,CAAC;AAjBD,8CAiBC"}

package/lib/extension.d.ts

@@ -1,3 +1,3 @@
-import type { PiletApi, ExtensionSlotProps } from 'piral-core';
+import type { ExtensionSlotProps } from 'piral-core';
 import type { Component } from './types';
-export declare function createExtension(api: PiletApi, rootName?: string): Component<ExtensionSlotProps>;
+export declare function createExtension(rootName: string): Component<ExtensionSlotProps>;

package/lib/extension.js

@@ -1,16 +1,19 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createExtension = void 0;
-var mount_1 = require("./mount");
-function createExtension(api, rootName) {
-    if (rootName === void 0) { rootName = 'slot'; }
-    return function (props) {
-        return mount_1.createHyperappElement(rootName, {
-            oncreate: function (element) {
-                api.renderHtmlExtension(element, props);
-            },
-        });
-    };
+const mount_1 = require("./mount");
+function createExtension(rootName) {
+    return (props) => (0, mount_1.createHyperappElement)(rootName, {
+        oncreate(element) {
+            element.dispatchEvent(new CustomEvent('render-html', {
+                bubbles: true,
+                detail: {
+                    target: element,
+                    props,
+                },
+            }));
+        },
+    });
 }
 exports.createExtension = createExtension;
 //# sourceMappingURL=extension.js.map

package/lib/extension.js.map

@@ -1 +1 @@
-{"version":3,"file":"extension.js","sourceRoot":"","sources":["../src/extension.ts"],"names":[],"mappings":";;;AACA,iCAAgD;AAGhD,SAAgB,eAAe,CAAC,GAAa,EAAE,QAAiB;IAAjB,yBAAA,EAAA,iBAAiB;IAC9D,OAAO,UAAC,KAAK;QACX,OAAA,6BAAqB,CAAC,QAAQ,EAAE;YAC9B,QAAQ,EAAR,UAAS,OAAoB;gBAC3B,GAAG,CAAC,mBAAmB,CAAC,OAAO,EAAE,KAAK,CAAC,CAAC;YAC1C,CAAC;SACF,CAAC;IAJF,CAIE,CAAC;AACP,CAAC;AAPD,0CAOC"}
+{"version":3,"file":"extension.js","sourceRoot":"","sources":["../src/extension.ts"],"names":[],"mappings":";;;AACA,mCAAgD;AAGhD,SAAgB,eAAe,CAAC,QAAgB;IAC9C,OAAO,CAAC,KAAK,EAAE,EAAE,CACf,IAAA,6BAAqB,EAAC,QAAQ,EAAE;QAC9B,QAAQ,CAAC,OAAoB;YAC3B,OAAO,CAAC,aAAa,CACnB,IAAI,WAAW,CAAC,aAAa,EAAE;gBAC7B,OAAO,EAAE,IAAI;gBACb,MAAM,EAAE;oBACN,MAAM,EAAE,OAAO;oBACf,KAAK;iBACN;aACF,CAAC,CACH,CAAC;QACJ,CAAC;KACF,CAAC,CAAC;AACP,CAAC;AAfD,0CAeC"}

package/lib/index.js

@@ -1,6 +1,6 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-var tslib_1 = require("tslib");
-tslib_1.__exportStar(require("./create"), exports);
-tslib_1.__exportStar(require("./types"), exports);
+const tslib_1 = require("tslib");
+(0, tslib_1.__exportStar)(require("./create"), exports);
+(0, tslib_1.__exportStar)(require("./types"), exports);
 //# sourceMappingURL=index.js.map

package/lib/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAAA,mDAAyB;AACzB,kDAAwB"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;AAAA,wDAAyB;AACzB,uDAAwB"}

package/lib/mount.d.ts

@@ -1,3 +1,3 @@
-import { Component } from './types';
+import type { Component } from './types';
 export declare function mountHyperapp<T extends Object>(el: HTMLElement, root: Component<T>, props: T, ctx: any, state: any, actions: any): void;
 export declare function createHyperappElement(name: string, props: any): any;

package/lib/mount.js

@@ -1,10 +1,9 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.createHyperappElement = exports.mountHyperapp = void 0;
-var tslib_1 = require("tslib");
-var _a = require('hyperapp'), h = _a.h, app = _a.app;
+const { h, app } = require('hyperapp');
 function mountHyperapp(el, root, props, ctx, state, actions) {
-    app(tslib_1.__assign(tslib_1.__assign({}, ctx), state), actions, function () { return h(root, props); }, el);
+    app(Object.assign(Object.assign({}, ctx), state), actions, () => h(root, props), el);
 }
 exports.mountHyperapp = mountHyperapp;
 function createHyperappElement(name, props) {

package/lib/mount.js.map

@@ -1 +1 @@
-{"version":3,"file":"mount.js","sourceRoot":"","sources":["../src/mount.ts"],"names":[],"mappings":";;;;AAEM,IAAA,KAAa,OAAO,CAAC,UAAU,CAAC,EAA9B,CAAC,OAAA,EAAE,GAAG,SAAwB,CAAC;AAEvC,SAAgB,aAAa,CAC3B,EAAe,EACf,IAAkB,EAClB,KAAQ,EACR,GAAQ,EACR,KAAU,EACV,OAAY;IAEZ,GAAG,uCAEI,GAAG,GACH,KAAK,GAEV,OAAO,EACP,cAAM,OAAA,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,EAAd,CAAc,EACpB,EAAE,CACH,CAAC;AACJ,CAAC;AAjBD,sCAiBC;AAED,SAAgB,qBAAqB,CAAC,IAAY,EAAE,KAAU;IAC5D,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;AAC5B,CAAC;AAFD,sDAEC"}
+{"version":3,"file":"mount.js","sourceRoot":"","sources":["../src/mount.ts"],"names":[],"mappings":";;;AAEA,MAAM,EAAE,CAAC,EAAE,GAAG,EAAE,GAAG,OAAO,CAAC,UAAU,CAAC,CAAC;AAEvC,SAAgB,aAAa,CAC3B,EAAe,EACf,IAAkB,EAClB,KAAQ,EACR,GAAQ,EACR,KAAU,EACV,OAAY;IAEZ,GAAG,iCAEI,GAAG,GACH,KAAK,GAEV,OAAO,EACP,GAAG,EAAE,CAAC,CAAC,CAAC,IAAI,EAAE,KAAK,CAAC,EACpB,EAAE,CACH,CAAC;AACJ,CAAC;AAjBD,sCAiBC;AAED,SAAgB,qBAAqB,CAAC,IAAY,EAAE,KAAU;IAC5D,OAAO,CAAC,CAAC,IAAI,EAAE,KAAK,EAAE,EAAE,CAAC,CAAC;AAC5B,CAAC;AAFD,sDAEC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "piral-hyperapp",
-  "version": "0.13.9",
+  "version": "0.14.0-beta.3157",
   "description": "Plugin for integrating hyperapp components in Piral.",
   "keywords": [
     "piral",
@@ -44,11 +44,11 @@
   },
   "devDependencies": {
     "hyperapp": "^1.2.10",
-    "piral-core": "^0.13.9"
+    "piral-core": "^0.14.0-beta.3157"
   },
   "peerDependencies": {
     "hyperapp": "^1.0.0",
-    "piral-core": "0.13.x"
+    "piral-core": "0.14.x"
   },
-  "gitHead": "80de9fb69430283bc90f380d3254e0e6aad4c6ad"
+  "gitHead": "1928e46becee1444f84df8e80a81aa12712d17e2"
 }

package/src/converter.ts

@@ -1,8 +1,19 @@
-import { ForeignComponent, BaseComponentProps } from 'piral-core';
+import type { ForeignComponent, BaseComponentProps } from 'piral-core';
 import { mountHyperapp } from './mount';
-import { Component } from './types';
+import { createExtension } from './extension';
+import type { Component } from './types';
 
-export function createConverter() {
+export interface HyperappConverterOptions {
+  /**
+   * Defines the name of the root element.
+   * @default slot
+   */
+  rootName?: string;
+}
+
+export function createConverter(config: HyperappConverterOptions = {}) {
+  const { rootName = 'slot' } = config;
+  const Extension = createExtension(rootName);
   const convert = <TProps extends BaseComponentProps>(
     root: Component<TProps>,
     state: any,
@@ -17,5 +28,6 @@ export function createConverter() {
       },
     };
   };
+  convert.Extension = Extension;
   return convert;
 }

package/src/create.ts

@@ -1,41 +1,30 @@
 import type { PiralPlugin } from 'piral-core';
-import { createConverter } from './converter';
-import { createExtension } from './extension';
+import { createConverter, HyperappConverterOptions } from './converter';
 import type { PiletHyperappApi } from './types';
 
 /**
  * Available configuration options for the Hyperapp plugin.
  */
-export interface HyperappConfig {
-  /**
-   * Defines the name of the root element.
-   * @default slot
-   */
-  rootName?: string;
-}
+export interface HyperappConfig extends HyperappConverterOptions {}
 
 /**
  * Creates new Pilet API extensions for the Hyperapp integration.
  */
 export function createHyperappApi(config: HyperappConfig = {}): PiralPlugin<PiletHyperappApi> {
-  const { rootName } = config;
-
   return (context) => {
-    const convert = createConverter();
+    const convert = createConverter(config);
     context.converters.hyperapp = ({ root, state, actions }) => convert(root, state, actions);
 
-    return (api) => {
-      return {
-        fromHyperapp(root, state, actions) {
-          return {
-            type: 'hyperapp',
-            root,
-            state,
-            actions,
-          };
-        },
-        HyperappExtension: createExtension(api, rootName),
-      };
+    return {
+      fromHyperapp(root, state, actions) {
+        return {
+          type: 'hyperapp',
+          root,
+          state,
+          actions,
+        };
+      },
+      HyperappExtension: convert.Extension,
     };
   };
 }

package/src/extension.ts

@@ -1,12 +1,20 @@
-import type { PiletApi, ExtensionSlotProps } from 'piral-core';
+import type { ExtensionSlotProps } from 'piral-core';
 import { createHyperappElement } from './mount';
 import type { Component } from './types';
 
-export function createExtension(api: PiletApi, rootName = 'slot'): Component<ExtensionSlotProps> {
+export function createExtension(rootName: string): Component<ExtensionSlotProps> {
   return (props) =>
     createHyperappElement(rootName, {
       oncreate(element: HTMLElement) {
-        api.renderHtmlExtension(element, props);
+        element.dispatchEvent(
+          new CustomEvent('render-html', {
+            bubbles: true,
+            detail: {
+              target: element,
+              props,
+            },
+          }),
+        );
       },
     });
 }

package/src/mount.ts

@@ -1,4 +1,4 @@
-import { Component } from './types';
+import type { Component } from './types';
 
 const { h, app } = require('hyperapp');