diff --git a/core/package-lock.json b/core/package-lock.json index 84ed0c05db5..841d7f9298e 100644 --- a/core/package-lock.json +++ b/core/package-lock.json @@ -19,7 +19,7 @@ "@rollup/plugin-node-resolve": "^8.4.0", "@rollup/plugin-virtual": "^2.0.3", "@stencil/sass": "1.3.2", - "@stencil/vue-output-target": "^0.4.2", + "@stencil/vue-output-target": "^0.4.3", "@types/jest": "^26.0.20", "@types/node": "^14.6.0", "@types/puppeteer": "5.4.3", @@ -1374,9 +1374,9 @@ "dev": true }, "node_modules/@stencil/vue-output-target": { - "version": "0.4.2", - "resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.4.2.tgz", - "integrity": "sha512-C+HYpVXpYUpD0x8eFC0Ahe45D3ZOUpMAh/RDCXsgooi1auWTaOFvA7YkXHpc6suBkh44HnPhYEA1VIslpU4QEA==", + "version": "0.4.3", + "resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.4.3.tgz", + "integrity": "sha512-+oTTSjzISERzrBDrtu3Iyhv69SSwzauQGnAej7GAWbLhzp/rCMyMHOTnZe5V+niJH9SHh1VahaVc3NQsA251qw==", "dev": true, "peerDependencies": { "@stencil/core": ">=1.8.0" @@ -15022,9 +15022,9 @@ "dev": true }, "@stencil/vue-output-target": { - "version": "0.4.2", - "resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.4.2.tgz", - "integrity": "sha512-C+HYpVXpYUpD0x8eFC0Ahe45D3ZOUpMAh/RDCXsgooi1auWTaOFvA7YkXHpc6suBkh44HnPhYEA1VIslpU4QEA==", + "version": "0.4.3", + "resolved": "https://registry.npmjs.org/@stencil/vue-output-target/-/vue-output-target-0.4.3.tgz", + "integrity": "sha512-+oTTSjzISERzrBDrtu3Iyhv69SSwzauQGnAej7GAWbLhzp/rCMyMHOTnZe5V+niJH9SHh1VahaVc3NQsA251qw==", "dev": true }, "@stylelint/postcss-css-in-js": { diff --git a/core/package.json b/core/package.json index a210d163223..15be22e62dd 100644 --- a/core/package.json +++ b/core/package.json @@ -41,7 +41,7 @@ "@rollup/plugin-node-resolve": "^8.4.0", "@rollup/plugin-virtual": "^2.0.3", "@stencil/sass": "1.3.2", - "@stencil/vue-output-target": "^0.4.2", + "@stencil/vue-output-target": "^0.4.3", "@types/jest": "^26.0.20", "@types/node": "^14.6.0", "@types/puppeteer": "5.4.3", diff --git a/packages/vue/src/vue-component-lib/utils.ts b/packages/vue/src/vue-component-lib/utils.ts index 176fc77652a..143e643a855 100644 --- a/packages/vue/src/vue-component-lib/utils.ts +++ b/packages/vue/src/vue-component-lib/utils.ts @@ -121,9 +121,17 @@ export const defineContainer = (name: string, componentProps: string[] = }; if (modelProp) { + /** + * Starting in Vue 3.1.0, all properties are + * added as keys to the props object, even if + * they are not being used. In order to correctly + * account for both value props and v-model props, + * we need to check if the key exists for Vue <3.1.0 + * and then check if it is not undefined for Vue >= 3.1.0. + */ propsToAdd = { ...propsToAdd, - [modelProp]: props.hasOwnProperty('modelValue') ? props.modelValue : modelPropValue + [modelProp]: props.hasOwnProperty(MODEL_VALUE) && props[MODEL_VALUE] !== undefined ? props.modelValue : modelPropValue } }