diff --git a/src/runtime/components/BoosterImage.vue b/src/runtime/components/BoosterImage.vue index 7fe9037ebe..9db8b622f2 100644 --- a/src/runtime/components/BoosterImage.vue +++ b/src/runtime/components/BoosterImage.vue @@ -3,6 +3,7 @@ import { useBoosterCritical, h } from '#imports'; import { LazyHydrationWrapper } from 'vue3-lazy-hydration'; import BoosterImage from '#booster/components/BoosterImage/Base'; +import imageProps from './BoosterImage/props'; export default { inheritAttrs: false, @@ -11,7 +12,8 @@ export default { hydrate: { type: Boolean, default: true - } + }, + ...imageProps }, setup() { const { isCritical } = useBoosterCritical(); @@ -28,11 +30,21 @@ export default { { class: 'nuxt-booster-image-noscript' }, - [h(BoosterImage, { ...this.$attrs, critical: this.hydrate })] + [ + h(BoosterImage, { + ...this.$attrs, + ...{ ...this.$props, hydrate: undefined }, + critical: this.hydrate + }) + ] ) ]); } - return h(BoosterImage, { ...this.$attrs, critical: this.isCritical }); + return h(BoosterImage, { + ...this.$attrs, + ...{ ...this.$props, hydrate: undefined }, + critical: this.isCritical + }); } }; diff --git a/src/runtime/components/BoosterImage/Base.vue b/src/runtime/components/BoosterImage/Base.vue index ac8b5fe736..2792d09779 100644 --- a/src/runtime/components/BoosterImage/Base.vue +++ b/src/runtime/components/BoosterImage/Base.vue @@ -17,7 +17,6 @@ diff --git a/src/runtime/components/BoosterPicture/Base.vue b/src/runtime/components/BoosterPicture/Base.vue index 5f6e1742b0..b75f5c1396 100644 --- a/src/runtime/components/BoosterPicture/Base.vue +++ b/src/runtime/components/BoosterPicture/Base.vue @@ -20,52 +20,17 @@ diff --git a/src/runtime/components/BoosterVimeo/Base.vue b/src/runtime/components/BoosterVimeo/Base.vue index 878f5eee29..0a42027f8f 100644 --- a/src/runtime/components/BoosterVimeo/Base.vue +++ b/src/runtime/components/BoosterVimeo/Base.vue @@ -36,6 +36,7 @@ import { load, ready } from './utils/loader'; import Vimeo from './classes/Vimeo'; import { isTouchSupported } from '#booster/utils/browser'; import BoosterPicture from '#booster/components/BoosterPicture'; +import props from './props'; const vimeo = new Vimeo(); @@ -45,50 +46,8 @@ export default { DefaultButton }, - props: { - autoplay: { - type: Boolean, - default: false - }, - - mute: { - type: Boolean, - default: undefined - }, - - url: { - type: String, - required: true - }, - - title: { - type: String, - required: false, - default: null - }, + props, - options: { - type: Object, - default() { - return {}; - } - }, - - posterSources: { - type: Array, - default() { - return [ - { - src: undefined, - media: 'all', - sizes: { - default: '100vw' - } - } - ]; - } - } - }, emits: ['playing', 'ready'], async setup(props) { diff --git a/src/runtime/components/BoosterVimeo/props.js b/src/runtime/components/BoosterVimeo/props.js new file mode 100644 index 0000000000..bf3403501d --- /dev/null +++ b/src/runtime/components/BoosterVimeo/props.js @@ -0,0 +1,44 @@ +export default { + autoplay: { + type: Boolean, + default: false + }, + + mute: { + type: Boolean, + default: undefined + }, + + url: { + type: String, + required: true + }, + + title: { + type: String, + required: false, + default: null + }, + + options: { + type: Object, + default() { + return {}; + } + }, + + posterSources: { + type: Array, + default() { + return [ + { + src: undefined, + media: 'all', + sizes: { + default: '100vw' + } + } + ]; + } + } +}; diff --git a/src/runtime/components/BoosterYoutube.vue b/src/runtime/components/BoosterYoutube.vue index cd9c137c9b..a2ecc5fd8f 100644 --- a/src/runtime/components/BoosterYoutube.vue +++ b/src/runtime/components/BoosterYoutube.vue @@ -1,5 +1,5 @@