@maas/vue-equipment 0.39.0 → 0.39.2

package/dist/nuxt/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@maas/vue-equipment/nuxt",
   "configKey": "vueEquipment",
-  "version": "0.38.0",
+  "version": "0.39.1",
   "builder": {
     "@nuxt/module-builder": "0.8.4",
     "unbuild": "unknown"

package/dist/plugins/MagicCookie/src/composables/useMagicCookie.mjs

@@ -13,6 +13,7 @@ export function useMagicCookie() {
     },
     set: (value) => {
       universalCookies.set("cookie_consent", value, {
+        path: "/",
         maxAge: cookieApiStore.value?.maxAge
       });
     }

package/dist/plugins/MagicPlayer/src/components/MagicPlayer.vue

@@ -1,9 +1,21 @@
 <template>
   <div
     ref="playerRef"
-    class="magic-player"
     @mouseenter="onMouseenter"
     @mouseleave="onMouseleave"
+    :class="[
+      'magic-player',
+      {
+        '-fullscreen': isFullscreen,
+        '-touched': touched,
+        '-untouched': !touched,
+        '-playing': playing,
+        '-paused': !playing,
+        '-waiting': waiting,
+        '-loaded': loaded,
+        '-muted': muted,
+      },
+    ]"
   >
     <video
       ref="videoRef"
@@ -53,23 +65,24 @@ const videoRef = ref<HTMLVideoElement | undefined>(undefined)
 
 const isVisible = useElementVisibility(playerRef)
 
-const { playing, muted } = usePlayerMediaApi({
+const { playing, waiting, muted } = usePlayerMediaApi({
   id: props.id,
   mediaRef: videoRef,
 })
 
-const { initialize, destroy } = usePlayerRuntime({
+const { initialize, loaded, destroy } = usePlayerRuntime({
   id: props.id,
   mediaRef: videoRef,
   src: props.src,
   srcType: props.srcType,
 })
 
-const { onMouseenter, onMouseleave, play, pause } = usePlayerVideoApi({
-  id: props.id,
-  videoRef: videoRef,
-  playerRef: playerRef,
-})
+const { onMouseenter, onMouseleave, isFullscreen, touched, play, pause } =
+  usePlayerVideoApi({
+    id: props.id,
+    videoRef: videoRef,
+    playerRef: playerRef,
+  })
 
 function onWindowFocus() {
   if (isVisible.value && !playing.value && props.autoplay) {
@@ -108,5 +121,5 @@ onBeforeUnmount(() => {
 </script>
 
 <style>
-.magic-player{aspect-ratio:var(--magic-player-aspect-ratio,16/9);background:var(--magic-player-background,#000);height:var(--magic-player-height,auto);overflow:hidden;position:relative;width:100%}.magic-player__video{height:100%;inset:0;-o-object-fit:cover;object-fit:cover;position:absolute;width:100%}
+.magic-player{aspect-ratio:var(--magic-player-aspect-ratio,16/9);background:var(--magic-player-background,#000);height:var(--magic-player-height,auto);overflow:hidden;position:relative;width:100%}.magic-player.-loaded{--magic-player-background:transparent}.magic-player__video{height:100%;inset:0;-o-object-fit:cover;object-fit:cover;position:absolute;width:100%}
 </style>

package/dist/utils/css/animations/fade-up-in.css

@@ -4,6 +4,7 @@
     transform: translate3d(0, 1rem, 0);
   }
   100% {
+    opacity: 1;
     transform: translate3d(0, 0, 0);
   }
 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maas/vue-equipment",
   "description": "A magic collection of Vue composables, plugins, components and directives",
-  "version": "0.39.0",
+  "version": "0.39.2",
   "author": "Robin Scholz <https://github.com/robinscholz>, Christoph Jeworutzki <https://github.com/ChristophJeworutzki>",
   "type": "module",
   "devDependencies": {
@@ -47,7 +47,7 @@
     "@maas/magic-timer": "^1.0.0",
     "@maas/vue-primitive": "^1.1.0",
     "@maas/wheel-gestures": "^1.0.0",
-    "@nuxt/kit": "^3.14.159",
+    "@nuxt/kit": "^3.14.1592",
     "@vueuse/core": "^10.3.0",
     "@vueuse/integrations": "^10.3.0",
     "defu": "^6.1.2",
@@ -56,7 +56,7 @@
     "luxon": "^3.4.2",
     "mitt": "^3.0.1",
     "motion": "^10.16.2",
-    "nuxt": "^3.14.159",
+    "nuxt": "^3.14.1592",
     "universal-cookie": "^7.1.0",
     "vue": "^3.5.3"
   },