piral-cycle 0.15.0-alpha.3816 → 0.15.0-alpha.3905

package/README.md

@@ -2,7 +2,7 @@
 
 # [Piral Cycle](https://piral.io) · [![GitHub License](https://img.shields.io/badge/license-MIT-blue.svg)](https://github.com/smapiot/piral/blob/main/LICENSE) [![npm version](https://img.shields.io/npm/v/piral-cycle.svg?style=flat)](https://www.npmjs.com/package/piral-cycle) [![tested with jest](https://img.shields.io/badge/tested_with-jest-99424f.svg)](https://jestjs.io) [![Gitter Chat](https://badges.gitter.im/gitterHQ/gitter.png)](https://gitter.im/piral-io/community)
 
-This is a plugin that only has a peer dependency to `piral-core`. What `piral-cycle` brings to the table is a set of Pilet API extensions that can be used with `piral` or `piral-core`.
+This is a plugin that only has a peer dependency to `@cycle/dom` and related packages. What `piral-cycle` brings to the table is a set of Pilet API extensions that can be used with `piral` or `piral-core`.
 
 The set includes a Cycle.js converter for any component registration, as well as a `fromCycle` shortcut and a `CycleExtension` component.
 

package/esm/converter.js

@@ -5,32 +5,29 @@ import { createExtension } from './extension';
 export function createConverter(config = {}) {
     const { rootName = 'slot' } = config;
     const Extension = createExtension(rootName);
-    const convert = (main) => {
-        let props$ = xs.create();
-        let dispose = () => { };
-        return {
-            mount(el, props) {
-                // The Cycle DOM element is not directly rendered into parent, but into a nested container.
-                // This is done because Cycle "erases" information on the host element. If parent was used,
-                // Piral related properties like data-portal-id could be removed, leading to things not working.
-                const host = el.appendChild(document.createElement('slot'));
-                const drivers = {
-                    DOM: makeDOMDriver(host),
-                    props: () => props$,
-                };
-                dispose = run(main, drivers);
-                props$.shamefullySendNext(props);
-            },
-            update(_, props) {
-                props$.shamefullySendNext(props);
-            },
-            unmount() {
-                props$.shamefullySendComplete();
-                dispose();
-                props$ = xs.create();
-            },
-        };
-    };
+    const convert = (main) => ({
+        mount(el, props, ctx, locals) {
+            locals.props$ = xs.create();
+            // The Cycle DOM element is not directly rendered into parent, but into a nested container.
+            // This is done because Cycle "erases" information on the host element. If parent was used,
+            // Piral related properties like data-portal-id could be removed, leading to things not working.
+            const host = el.appendChild(document.createElement('slot'));
+            const drivers = {
+                DOM: makeDOMDriver(host),
+                props: () => locals.props$,
+            };
+            locals.dispose = run(main, drivers);
+            locals.props$.shamefullySendNext(props);
+        },
+        update(el, props, ctx, locals) {
+            locals.props$.shamefullySendNext(props);
+        },
+        unmount(el, locals) {
+            locals.props$.shamefullySendComplete();
+            locals.dispose();
+            locals.props$ = undefined;
+        },
+    });
     convert.Extension = Extension;
     return convert;
 }

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,YAAY,CAAC;AAC3C,OAAO,GAA2B,MAAM,YAAY,CAAC;AACrD,OAAO,EAAE,MAAM,SAAS,CAAC;AACzB,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAW9C,MAAM,UAAU,eAAe,CAAC,SAAgC,EAAE;IAChE,MAAM,EAAE,QAAQ,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;IACrC,MAAM,SAAS,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IAC5C,MAAM,OAAO,GAAG,CACd,IAAO,EACmB,EAAE;QAC5B,IAAI,MAAM,GAAG,EAAE,CAAC,MAAM,EAAU,CAAC;QACjC,IAAI,OAAO,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;QAEvB,OAAO;YACL,KAAK,CAAC,EAAE,EAAE,KAAK;gBACb,2FAA2F;gBAC3F,2FAA2F;gBAC3F,gGAAgG;gBAChG,MAAM,IAAI,GAAG,EAAE,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC;gBAE5D,MAAM,OAAO,GAA4B;oBACvC,GAAG,EAAE,aAAa,CAAC,IAAI,CAAC;oBACxB,KAAK,EAAE,GAAG,EAAE,CAAC,MAAM;iBACpB,CAAC;gBAEF,OAAO,GAAG,GAAG,CAAC,IAAY,EAAE,OAAO,CAAC,CAAC;gBACrC,MAAM,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;YACnC,CAAC;YACD,MAAM,CAAC,CAAC,EAAE,KAAK;gBACb,MAAM,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;YACnC,CAAC;YACD,OAAO;gBACL,MAAM,CAAC,sBAAsB,EAAE,CAAC;gBAChC,OAAO,EAAE,CAAC;gBACV,MAAM,GAAG,EAAE,CAAC,MAAM,EAAU,CAAC;YAC/B,CAAC;SACF,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CAAC,SAAS,GAAG,SAAS,CAAC;IAC9B,OAAO,OAAO,CAAC;AACjB,CAAC"}
+{"version":3,"file":"converter.js","sourceRoot":"","sources":["../src/converter.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,aAAa,EAAE,MAAM,YAAY,CAAC;AAC3C,OAAO,GAA2B,MAAM,YAAY,CAAC;AACrD,OAAO,EAAc,MAAM,SAAS,CAAC;AACrC,OAAO,EAAE,eAAe,EAAE,MAAM,aAAa,CAAC;AAgB9C,MAAM,UAAU,eAAe,CAAC,SAAgC,EAAE;IAChE,MAAM,EAAE,QAAQ,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;IACrC,MAAM,SAAS,GAAG,eAAe,CAAC,QAAQ,CAAC,CAAC;IAC5C,MAAM,OAAO,GAAG,CACd,IAAO,EACmB,EAAE,CAAC,CAAC;QAC9B,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAA0B;YAC9C,MAAM,CAAC,MAAM,GAAG,EAAE,CAAC,MAAM,EAAU,CAAC;YAEpC,2FAA2F;YAC3F,2FAA2F;YAC3F,gGAAgG;YAChG,MAAM,IAAI,GAAG,EAAE,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC;YAE5D,MAAM,OAAO,GAA4B;gBACvC,GAAG,EAAE,aAAa,CAAC,IAAI,CAAC;gBACxB,KAAK,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,MAAM;aAC3B,CAAC;YAEF,MAAM,CAAC,OAAO,GAAG,GAAG,CAAC,IAAY,EAAE,OAAO,CAAC,CAAC;YAC5C,MAAM,CAAC,MAAM,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC;QACD,MAAM,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAA0B;YAC/C,MAAM,CAAC,MAAM,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC;QACD,OAAO,CAAC,EAAE,EAAE,MAA0B;YACpC,MAAM,CAAC,MAAM,CAAC,sBAAsB,EAAE,CAAC;YACvC,MAAM,CAAC,OAAO,EAAE,CAAC;YACjB,MAAM,CAAC,MAAM,GAAG,SAAS,CAAC;QAC5B,CAAC;KACF,CAAC,CAAC;IAEH,OAAO,CAAC,SAAS,GAAG,SAAS,CAAC;IAC9B,OAAO,OAAO,CAAC;AACjB,CAAC"}

package/esm/types.d.ts

@@ -1,7 +1,7 @@
 import { Stream } from 'xstream';
 import { Driver, Drivers, MatchingMain, Main } from '@cycle/run';
 import { MainDOMSource, VNode } from '@cycle/dom';
-import { ForeignComponent, ExtensionSlotProps } from 'piral-core';
+import type { ForeignComponent, ExtensionSlotProps } from 'piral-core';
 declare module 'piral-core/lib/types/custom' {
     interface PiletCustomApi extends PiletCycleApi {
     }

package/lib/converter.js

@@ -8,32 +8,29 @@ const extension_1 = require("./extension");
 function createConverter(config = {}) {
     const { rootName = 'slot' } = config;
     const Extension = (0, extension_1.createExtension)(rootName);
-    const convert = (main) => {
-        let props$ = xstream_1.default.create();
-        let dispose = () => { };
-        return {
-            mount(el, props) {
-                // The Cycle DOM element is not directly rendered into parent, but into a nested container.
-                // This is done because Cycle "erases" information on the host element. If parent was used,
-                // Piral related properties like data-portal-id could be removed, leading to things not working.
-                const host = el.appendChild(document.createElement('slot'));
-                const drivers = {
-                    DOM: (0, dom_1.makeDOMDriver)(host),
-                    props: () => props$,
-                };
-                dispose = (0, run_1.default)(main, drivers);
-                props$.shamefullySendNext(props);
-            },
-            update(_, props) {
-                props$.shamefullySendNext(props);
-            },
-            unmount() {
-                props$.shamefullySendComplete();
-                dispose();
-                props$ = xstream_1.default.create();
-            },
-        };
-    };
+    const convert = (main) => ({
+        mount(el, props, ctx, locals) {
+            locals.props$ = xstream_1.default.create();
+            // The Cycle DOM element is not directly rendered into parent, but into a nested container.
+            // This is done because Cycle "erases" information on the host element. If parent was used,
+            // Piral related properties like data-portal-id could be removed, leading to things not working.
+            const host = el.appendChild(document.createElement('slot'));
+            const drivers = {
+                DOM: (0, dom_1.makeDOMDriver)(host),
+                props: () => locals.props$,
+            };
+            locals.dispose = (0, run_1.default)(main, drivers);
+            locals.props$.shamefullySendNext(props);
+        },
+        update(el, props, ctx, locals) {
+            locals.props$.shamefullySendNext(props);
+        },
+        unmount(el, locals) {
+            locals.props$.shamefullySendComplete();
+            locals.dispose();
+            locals.props$ = undefined;
+        },
+    });
     convert.Extension = Extension;
     return convert;
 }

package/lib/converter.js.map

@@ -1 +1 @@
-{"version":3,"file":"converter.js","sourceRoot":"","sources":["../src/converter.ts"],"names":[],"mappings":";;;AACA,oCAA2C;AAC3C,oCAAqD;AACrD,qCAAyB;AACzB,2CAA8C;AAW9C,SAAgB,eAAe,CAAC,SAAgC,EAAE;IAChE,MAAM,EAAE,QAAQ,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;IACrC,MAAM,SAAS,GAAG,IAAA,2BAAe,EAAC,QAAQ,CAAC,CAAC;IAC5C,MAAM,OAAO,GAAG,CACd,IAAO,EACmB,EAAE;QAC5B,IAAI,MAAM,GAAG,iBAAE,CAAC,MAAM,EAAU,CAAC;QACjC,IAAI,OAAO,GAAG,GAAG,EAAE,GAAE,CAAC,CAAC;QAEvB,OAAO;YACL,KAAK,CAAC,EAAE,EAAE,KAAK;gBACb,2FAA2F;gBAC3F,2FAA2F;gBAC3F,gGAAgG;gBAChG,MAAM,IAAI,GAAG,EAAE,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC;gBAE5D,MAAM,OAAO,GAA4B;oBACvC,GAAG,EAAE,IAAA,mBAAa,EAAC,IAAI,CAAC;oBACxB,KAAK,EAAE,GAAG,EAAE,CAAC,MAAM;iBACpB,CAAC;gBAEF,OAAO,GAAG,IAAA,aAAG,EAAC,IAAY,EAAE,OAAO,CAAC,CAAC;gBACrC,MAAM,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;YACnC,CAAC;YACD,MAAM,CAAC,CAAC,EAAE,KAAK;gBACb,MAAM,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;YACnC,CAAC;YACD,OAAO;gBACL,MAAM,CAAC,sBAAsB,EAAE,CAAC;gBAChC,OAAO,EAAE,CAAC;gBACV,MAAM,GAAG,iBAAE,CAAC,MAAM,EAAU,CAAC;YAC/B,CAAC;SACF,CAAC;IACJ,CAAC,CAAC;IAEF,OAAO,CAAC,SAAS,GAAG,SAAS,CAAC;IAC9B,OAAO,OAAO,CAAC;AACjB,CAAC;AArCD,0CAqCC"}
+{"version":3,"file":"converter.js","sourceRoot":"","sources":["../src/converter.ts"],"names":[],"mappings":";;;AACA,oCAA2C;AAC3C,oCAAqD;AACrD,qCAAqC;AACrC,2CAA8C;AAgB9C,SAAgB,eAAe,CAAC,SAAgC,EAAE;IAChE,MAAM,EAAE,QAAQ,GAAG,MAAM,EAAE,GAAG,MAAM,CAAC;IACrC,MAAM,SAAS,GAAG,IAAA,2BAAe,EAAC,QAAQ,CAAC,CAAC;IAC5C,MAAM,OAAO,GAAG,CACd,IAAO,EACmB,EAAE,CAAC,CAAC;QAC9B,KAAK,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAA0B;YAC9C,MAAM,CAAC,MAAM,GAAG,iBAAE,CAAC,MAAM,EAAU,CAAC;YAEpC,2FAA2F;YAC3F,2FAA2F;YAC3F,gGAAgG;YAChG,MAAM,IAAI,GAAG,EAAE,CAAC,WAAW,CAAC,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAC,CAAC;YAE5D,MAAM,OAAO,GAA4B;gBACvC,GAAG,EAAE,IAAA,mBAAa,EAAC,IAAI,CAAC;gBACxB,KAAK,EAAE,GAAG,EAAE,CAAC,MAAM,CAAC,MAAM;aAC3B,CAAC;YAEF,MAAM,CAAC,OAAO,GAAG,IAAA,aAAG,EAAC,IAAY,EAAE,OAAO,CAAC,CAAC;YAC5C,MAAM,CAAC,MAAM,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC;QACD,MAAM,CAAC,EAAE,EAAE,KAAK,EAAE,GAAG,EAAE,MAA0B;YAC/C,MAAM,CAAC,MAAM,CAAC,kBAAkB,CAAC,KAAK,CAAC,CAAC;QAC1C,CAAC;QACD,OAAO,CAAC,EAAE,EAAE,MAA0B;YACpC,MAAM,CAAC,MAAM,CAAC,sBAAsB,EAAE,CAAC;YACvC,MAAM,CAAC,OAAO,EAAE,CAAC;YACjB,MAAM,CAAC,MAAM,GAAG,SAAS,CAAC;QAC5B,CAAC;KACF,CAAC,CAAC;IAEH,OAAO,CAAC,SAAS,GAAG,SAAS,CAAC;IAC9B,OAAO,OAAO,CAAC;AACjB,CAAC;AAlCD,0CAkCC"}

package/lib/types.d.ts

@@ -1,7 +1,7 @@
 import { Stream } from 'xstream';
 import { Driver, Drivers, MatchingMain, Main } from '@cycle/run';
 import { MainDOMSource, VNode } from '@cycle/dom';
-import { ForeignComponent, ExtensionSlotProps } from 'piral-core';
+import type { ForeignComponent, ExtensionSlotProps } from 'piral-core';
 declare module 'piral-core/lib/types/custom' {
     interface PiletCustomApi extends PiletCycleApi {
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "piral-cycle",
-  "version": "0.15.0-alpha.3816",
+  "version": "0.15.0-alpha.3905",
   "description": "Plugin for integrating Cycle.js components in Piral.",
   "keywords": [
     "piral",
@@ -46,14 +46,13 @@
   "devDependencies": {
     "@cycle/dom": "^22.7.0",
     "@cycle/run": "^5.4.0",
-    "piral-core": "0.15.0-alpha.3816",
+    "piral-core": "0.15.0-alpha.3905",
     "xstream": "^11.12.0"
   },
   "peerDependencies": {
     "@cycle/dom": "^22.0.0",
     "@cycle/run": "^5.0.0",
-    "piral-core": "0.14.x",
     "xstream": "^11.0.0"
   },
-  "gitHead": "cfd7ed44c6b73655be56587aeaf774692e0c94ad"
+  "gitHead": "533d09963cfd8c901df797958ca386dbae0286e1"
 }

package/src/converter.ts

@@ -1,7 +1,7 @@
 import type { BaseComponentProps, ForeignComponent } from 'piral-core';
 import { makeDOMDriver } from '@cycle/dom';
 import run, { MatchingMain, Main } from '@cycle/run';
-import xs from 'xstream';
+import xs, { Stream } from 'xstream';
 import { createExtension } from './extension';
 import type { PiralDomDrivers } from './types';
 
@@ -13,40 +13,42 @@ export interface CycleConverterOptions {
   rootName?: string;
 }
 
+interface CycleState<TProps> {
+  props$: Stream<TProps>;
+  dispose(): void;
+}
+
 export function createConverter(config: CycleConverterOptions = {}) {
   const { rootName = 'slot' } = config;
   const Extension = createExtension(rootName);
   const convert = <TProps extends BaseComponentProps, M extends MatchingMain<PiralDomDrivers<TProps>, M>>(
     main: M,
-  ): ForeignComponent<TProps> => {
-    let props$ = xs.create<TProps>();
-    let dispose = () => {};
+  ): ForeignComponent<TProps> => ({
+    mount(el, props, ctx, locals: CycleState<TProps>) {
+      locals.props$ = xs.create<TProps>();
 
-    return {
-      mount(el, props) {
-        // The Cycle DOM element is not directly rendered into parent, but into a nested container.
-        // This is done because Cycle "erases" information on the host element. If parent was used,
-        // Piral related properties like data-portal-id could be removed, leading to things not working.
-        const host = el.appendChild(document.createElement('slot'));
+      // The Cycle DOM element is not directly rendered into parent, but into a nested container.
+      // This is done because Cycle "erases" information on the host element. If parent was used,
+      // Piral related properties like data-portal-id could be removed, leading to things not working.
+      const host = el.appendChild(document.createElement('slot'));
 
-        const drivers: PiralDomDrivers<TProps> = {
-          DOM: makeDOMDriver(host),
-          props: () => props$,
-        };
+      const drivers: PiralDomDrivers<TProps> = {
+        DOM: makeDOMDriver(host),
+        props: () => locals.props$,
+      };
 
-        dispose = run(main as Main, drivers);
-        props$.shamefullySendNext(props);
-      },
-      update(_, props) {
-        props$.shamefullySendNext(props);
-      },
-      unmount() {
-        props$.shamefullySendComplete();
-        dispose();
-        props$ = xs.create<TProps>();
-      },
-    };
-  };
+      locals.dispose = run(main as Main, drivers);
+      locals.props$.shamefullySendNext(props);
+    },
+    update(el, props, ctx, locals: CycleState<TProps>) {
+      locals.props$.shamefullySendNext(props);
+    },
+    unmount(el, locals: CycleState<TProps>) {
+      locals.props$.shamefullySendComplete();
+      locals.dispose();
+      locals.props$ = undefined;
+    },
+  });
 
   convert.Extension = Extension;
   return convert;

package/src/types.ts

@@ -1,7 +1,7 @@
 import { Stream } from 'xstream';
 import { Driver, Drivers, MatchingMain, Main } from '@cycle/run';
 import { MainDOMSource, VNode } from '@cycle/dom';
-import { ForeignComponent, ExtensionSlotProps } from 'piral-core';
+import type { ForeignComponent, ExtensionSlotProps } from 'piral-core';
 
 declare module 'piral-core/lib/types/custom' {
   interface PiletCustomApi extends PiletCycleApi {}