@maas/vue-equipment 0.10.2 → 0.10.4

package/dist/nuxt/module.json

@@ -1,5 +1,5 @@
 {
   "name": "@maas/vue-equipment",
   "configKey": "vueEquipment",
-  "version": "0.10.1"
+  "version": "0.10.3"
 }

package/dist/plugins/MagicConsent/nuxt.mjs

@@ -12,6 +12,7 @@ export default defineNuxtModule({
   setup(_options, nuxt) {
     const resolver = createResolver(import.meta.url);
     nuxt.options.build.transpile.push("universal-cookie");
+    nuxt.options.build.transpile.push("@vueuse/integrations/useCookies");
     extendViteConfig((config) => {
       config.optimizeDeps = config.optimizeDeps || {};
       config.optimizeDeps.include = config.optimizeDeps.include || [];

package/dist/plugins/MagicConsent/src/composables/useConsentApi.mjs

@@ -3,20 +3,20 @@ import { useCookies } from "@vueuse/integrations/useCookies";
 import { toValue } from "@vueuse/core";
 import { globalApiState } from "./private/defineConsentApi.mjs";
 import { useConsentEmitter } from "./useConsentEmitter.mjs";
-const universalCookies = useCookies(["cookie_consent"]);
 const preferencesVisible = ref(false);
 const selectedCookies = ref({});
-const cookieConsentData = computed({
-  get: () => {
-    return universalCookies.get("cookie_consent");
-  },
-  set: (value) => {
-    universalCookies.set("cookie_consent", value, {
-      maxAge: globalApiState.value?.maxAge
-    });
-  }
-});
 export function useConsentApi() {
+  const universalCookies = useCookies(["cookie_consent"]);
+  const cookieConsentData = computed({
+    get: () => {
+      return universalCookies.get("cookie_consent");
+    },
+    set: (value) => {
+      universalCookies.set("cookie_consent", value, {
+        maxAge: globalApiState.value?.maxAge
+      });
+    }
+  });
   const emitter = useConsentEmitter();
   selectedCookies.value = cookieConsentData.value?.cookies || {};
   function toggleSelection(key) {

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

@@ -16,9 +16,9 @@
 <script setup lang="ts">
 import { ref, computed } from 'vue'
 import { useIntersectionObserver } from '@vueuse/core'
+import { useProvidePlayer } from '../composables/usePlayer'
 
 import type { SourceType } from './../types'
-import { useProvidePlayer } from '../composables/usePlayer'
 
 export type MagicPlayerProps = {
   srcType?: SourceType
@@ -78,7 +78,7 @@ defineExpose({
 })
 </script>
 
-<style lang="postcss">
+<style lang="css">
 .magic-player {
   --aspect-ratio: 16 / 9;
   position: relative;

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

@@ -123,7 +123,7 @@ defineExpose({
 })
 </script>
 
-<style lang="postcss">
+<style lang="css">
 :root {
   --magic-player-controls-height: 3rem;
   --magic-player-controls-bottom: 1.5rem;

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

@@ -62,7 +62,7 @@ async function init() {
 
   try {
     storyboard.value = await fetch(
-      `https://image.mux.com/${props.playbackId}/storyboard.json`
+      `https://image.mux.com/${props.playbackId}/storyboard.json`,
     ).then((res) => res.json())
 
     if (!storyboard.value) throw new Error()
@@ -107,7 +107,7 @@ function drawFrame(time: number) {
     0,
     0,
     tile_width,
-    tile_height
+    tile_height,
   )
 }
 
@@ -115,7 +115,7 @@ onMounted(init)
 watch(() => seekedTime.value, drawFrame)
 </script>
 
-<style lang="postcss">
+<style lang="css">
 :root {
   --magic-player-popover-border-radius: 0.25rem;
 }
@@ -125,7 +125,7 @@ watch(() => seekedTime.value, drawFrame)
   overflow: hidden;
 }
 
-canvas {
+.magic-player-mux-popover canvas {
   width: 100%;
   height: auto;
 }

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

@@ -52,7 +52,7 @@ const {
 } = controlsApi
 </script>
 
-<style lang="postcss">
+<style lang="css">
 :root {
   --magic-player-target-height: 56px;
   --magic-player-track-height: 4px;
@@ -116,6 +116,7 @@ const {
   background-color: var(--magic-player-thumb-bg-color);
   border-radius: 50rem;
 }
+
 .magic-player-timeline__slider-scrubbed,
 .magic-player-timeline__slider-seeked,
 .magic-player-timeline__slider-buffered {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maas/vue-equipment",
   "description": "A magic collection of Vue composables, plugins, components and directives",
-  "version": "0.10.2",
+  "version": "0.10.4",
   "author": "Robin Scholz <https://github.com/robinscholz>, Christoph Jeworutzki <https://github.com/ChristophJeworutzki>",
   "devDependencies": {
     "@antfu/ni": "^0.21.5",