diff --git a/CHANGELOG.md b/CHANGELOG.md index 123253437..0fbc09a32 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,10 @@ # Piral Changelog +## 1.7.1 (tbd) + +- Fixed `engines` field to have a constraint for Node.js >=18.17 +- Fixed release mode behavior of `piral-vue3` reactivity (#720) + ## 1.7.0 (October 16, 2024) - Fixed issue in `piral-vue3` concerning reactivity of props (#720) diff --git a/src/converters/piral-vue-3/src/converter.ts b/src/converters/piral-vue-3/src/converter.ts index b0bf66ea6..9667d530b 100644 --- a/src/converters/piral-vue-3/src/converter.ts +++ b/src/converters/piral-vue-3/src/converter.ts @@ -1,5 +1,5 @@ import type { ForeignComponent, BaseComponentProps } from 'piral-core'; -import { Component, App } from 'vue'; +import { Component, App, reactive } from 'vue'; import { createExtension } from './extension'; import { mountVue } from './mount'; import { Vue3MiddlewareHandler } from './types'; @@ -19,6 +19,7 @@ export interface Vue3ConverterOptions { interface Vue3State { instance: App; + props: any; } export function createConverter(config: Vue3ConverterOptions = {}) { @@ -27,27 +28,31 @@ export function createConverter(config: Vue3ConverterOptions = {}) { const middlewares: Array = []; const convert = ( root: Component, - captured?: Record, + captured: Record = {}, ): ForeignComponent => ({ mount(parent, data, ctx, locals: Vue3State) { const el = parent.appendChild(document.createElement(rootName)); - const app = mountVue(root, data, ctx, captured); + const props = reactive({ + ...captured, + ...data, + }); + const app = mountVue(root, props, ctx); middlewares.forEach((middleware) => middleware(app)); app.component(selector, createExtension(rootName)); app.mount(el); locals.instance = app; + locals.props = props; }, update(parent, data, ctx, locals: Vue3State) { - const appInstance = locals.instance._instance; - for (const prop in data) { - appInstance.props[prop] = data[prop]; + locals.props[prop] = data[prop]; } }, unmount(parent, locals: Vue3State) { locals.instance.unmount(); parent.innerHTML = ''; locals.instance = undefined; + locals.props = undefined; }, }); convert.Extension = Extension; diff --git a/src/converters/piral-vue-3/src/mount.ts b/src/converters/piral-vue-3/src/mount.ts index dbef52668..29e64441c 100644 --- a/src/converters/piral-vue-3/src/mount.ts +++ b/src/converters/piral-vue-3/src/mount.ts @@ -5,22 +5,16 @@ export function mountVue( component: Component, props: T, ctx: ComponentContext, - captured?: Record, ) { - const data = { - ...captured, - ...props, - }; const root: Component = { provide: { piral: props.piral, ...ctx, }, - props: Object.keys(data), render() { - return h(component, this.$props); + return h(component, props); }, }; - return createApp(root, data); + return createApp(root); } diff --git a/src/initializers/create-pilet/package.json b/src/initializers/create-pilet/package.json index bd5b41a9d..0453a4493 100644 --- a/src/initializers/create-pilet/package.json +++ b/src/initializers/create-pilet/package.json @@ -15,7 +15,7 @@ "main": "lib/index.js", "typings": "lib/index.d.ts", "engines": { - "node": ">=16.0.0" + "node": ">=18.17" }, "files": [ "lib", diff --git a/src/initializers/create-piral-instance/package.json b/src/initializers/create-piral-instance/package.json index 48547d465..a81a36d98 100644 --- a/src/initializers/create-piral-instance/package.json +++ b/src/initializers/create-piral-instance/package.json @@ -16,7 +16,7 @@ "main": "lib/index.js", "typings": "lib/index.d.ts", "engines": { - "node": ">=16.0.0" + "node": ">=18.17" }, "files": [ "lib", diff --git a/src/tooling/piral-cli-webpack5/package.json b/src/tooling/piral-cli-webpack5/package.json index 4b3b10107..af941d8d4 100644 --- a/src/tooling/piral-cli-webpack5/package.json +++ b/src/tooling/piral-cli-webpack5/package.json @@ -19,7 +19,7 @@ "main": "lib/index.js", "typings": "lib/index.d.ts", "engines": { - "node": ">=16.0.0" + "node": ">=18.17" }, "files": [ "lib", diff --git a/src/tooling/piral-cli/package.json b/src/tooling/piral-cli/package.json index 871cceb08..8a1d536f5 100644 --- a/src/tooling/piral-cli/package.json +++ b/src/tooling/piral-cli/package.json @@ -15,7 +15,7 @@ "main": "lib/index.js", "typings": "lib/index.d.ts", "engines": { - "node": ">=16.0.0" + "node": ">=18.17" }, "files": [ "lib",