@maas/vue-equipment 1.0.0-beta.57 → 1.0.0-beta.58

package/dist/composables/useScrollTo/index.js

@@ -80,7 +80,9 @@ function useScrollTo() {
     const startTime = Date.now();
     const { x: fromX, y: fromY } = getScrollPosition(parent);
     if (fromX === top && fromY === left) {
-      if (callback) callback();
+      if (callback) {
+        callback();
+      }
       return;
     }
     const mappedDuration = { x: 500, y: 500, ...duration };

package/dist/composables/useScrollTo/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../packages/composables/useScrollTo/index.ts"],"sourcesContent":["import {\n  unrefElement,\n  type MaybeComputedElementRef,\n  type MaybeElement,\n} from '@vueuse/core'\nimport { easeOutQuad } from '@maas/vue-equipment/utils'\n\nexport type ScrollToTarget =\n  | string\n  | Element\n  | MaybeElement\n  | MaybeComputedElementRef\n\nexport type ScrollToParent = ScrollToTarget | Window\n\nexport type ScrollToParams = {\n  parent?: Element | Window\n  left: number\n  top: number\n  duration?: { x?: number; y?: number }\n  easing?: (t: number) => number\n  callback?: () => void\n}\n\nexport type getScrollDurationParams = {\n  parent: Element | Window\n  left: number\n  top: number\n  speed: number\n}\n\nexport type scrollToTargetParams = {\n  target: ScrollToTarget\n  parent?: ScrollToParent\n  offset?: {\n    x?: number\n    y?: number\n  }\n  speed?: number\n  easing?: (t: number) => number\n}\n\n// Private functions\nfunction min(a: number, b: number) {\n  return a < b ? a : b\n}\n\nfunction unwrapParent(parent: ScrollToParent) {\n  if (parent === window) {\n    return parent\n  } else if (typeof parent === 'string') {\n    return document.querySelector(parent) || document.documentElement\n  } else {\n    return (\n      unrefElement(parent as MaybeComputedElementRef<MaybeElement>) ||\n      document.documentElement\n    )\n  }\n}\n\nfunction unwrapTarget(target: ScrollToTarget, parentEl: Element | Window) {\n  if (typeof target === 'string') {\n    const queryTarget = parentEl === window ? document : (parentEl as Element)\n    return queryTarget.querySelector(target)\n  } else {\n    return unrefElement(target as MaybeComputedElementRef<MaybeElement>)\n  }\n}\n\nfunction isHtmlElement(\n  parentEl: Window | SVGElement | Element\n): parentEl is HTMLElement {\n  return parentEl instanceof HTMLElement\n}\n\nfunction disableScrollSnap(parentEl: Window | SVGElement | Element) {\n  if (isHtmlElement(parentEl)) {\n    parentEl.style.scrollSnapType = 'none'\n  }\n}\n\nfunction reenableScrollSnap(parentEl: Window | SVGElement | Element) {\n  if (isHtmlElement(parentEl)) {\n    parentEl.style.scrollSnapType = ''\n  }\n}\n\n// Public composable\nexport function useScrollTo() {\n  function getScrollPosition(element: Element | Window): {\n    x: number\n    y: number\n  } {\n    if (element === window) {\n      return { x: window.scrollX, y: window.scrollY }\n    } else if (element instanceof Element) {\n      return { x: element.scrollLeft, y: element.scrollTop }\n    } else {\n      return { x: 0, y: 0 }\n    }\n  }\n\n  function getDistance(\n    target: Element,\n    parent?: Element | Window\n  ): { top: number; left: number } {\n    const rect = target.getBoundingClientRect()\n    const scrollEl =\n      parent || document.scrollingElement || document.documentElement\n\n    const scrollTop = scrollEl instanceof Window ? 0 : scrollEl.scrollTop\n    const scrollLeft = scrollEl instanceof Window ? 0 : scrollEl.scrollLeft\n\n    return {\n      top: rect.top + scrollTop,\n      left: rect.left + scrollLeft,\n    }\n  }\n\n  function getScrollDuration({\n    parent = document.documentElement || document.body,\n    left = 0,\n    top = 0,\n    speed = 500,\n  }: getScrollDurationParams) {\n    const currentPos = getScrollPosition(parent)\n    const distanceX = currentPos.x - left\n    const distanceY = currentPos.y - top\n    const durationX = Math.abs((distanceX / speed) * 100)\n    const durationY = Math.abs((distanceY / speed) * 100)\n\n    return { x: durationX, y: durationY }\n  }\n\n  function scrollTo({\n    parent = document.documentElement || document.body,\n    top,\n    left,\n    duration = {},\n    easing = easeOutQuad,\n    callback,\n  }: ScrollToParams) {\n    const startTime = Date.now()\n    const { x: fromX, y: fromY } = getScrollPosition(parent)\n\n    if (fromX === top && fromY === left) {\n      if (callback) callback()\n      return\n    }\n\n    const mappedDuration = { x: 500, y: 500, ...duration }\n\n    const scroll = () => {\n      const currentTime = Date.now()\n\n      const timeX = min(1, (currentTime - startTime) / mappedDuration.x)\n      const timeY = min(1, (currentTime - startTime) / mappedDuration.y)\n      const easedTimeX = easing(timeX)\n      const easedTimeY = easing(timeY)\n\n      // We use the min of the two times to make sure we scroll at the same speed\n      const minTime = Math.min(easedTimeX, easedTimeY)\n\n      parent.scroll({\n        left: minTime * (left - fromX) + fromX,\n        top: minTime * (top - fromY) + fromY,\n      })\n\n      if (easedTimeX < 1 || easedTimeY < 1) {\n        requestAnimationFrame(scroll)\n      } else if (callback) {\n        callback()\n      }\n    }\n\n    requestAnimationFrame(scroll)\n  }\n\n  function scrollToTarget({\n    target,\n    parent = document.documentElement || document.body,\n    offset = {},\n    speed = 500,\n    easing = easeOutQuad,\n  }: scrollToTargetParams) {\n    const parentEl = unwrapParent(parent)\n    if (!parentEl) {\n      return\n    }\n    const targetEl = unwrapTarget(target, parentEl)\n    if (!targetEl) {\n      return\n    }\n\n    disableScrollSnap(parentEl)\n\n    const mappedOffset = { x: 0, y: 0, ...offset }\n    const distance = getDistance(targetEl, parentEl)\n    const leftDistance = distance.left - mappedOffset.x\n    const topDistance = distance.top - mappedOffset.y\n\n    const scrollDuration = getScrollDuration({\n      parent: parentEl,\n      left: leftDistance,\n      top: topDistance,\n      speed: speed,\n    })\n\n    scrollTo({\n      parent: parentEl,\n      left: leftDistance,\n      top: topDistance,\n      duration: scrollDuration,\n      easing: easing,\n      callback: () => reenableScrollSnap(parentEl),\n    })\n  }\n\n  return {\n    getScrollPosition,\n    getDistance,\n    getScrollDuration,\n    scrollTo,\n    scrollToTarget,\n  }\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../../packages/composables/useScrollTo/index.ts"],"sourcesContent":["import {\n  unrefElement,\n  type MaybeComputedElementRef,\n  type MaybeElement,\n} from '@vueuse/core'\nimport { easeOutQuad } from '@maas/vue-equipment/utils'\n\nexport type ScrollToTarget =\n  | string\n  | Element\n  | MaybeElement\n  | MaybeComputedElementRef\n\nexport type ScrollToParent = ScrollToTarget | Window\n\nexport type ScrollToParams = {\n  parent?: Element | Window\n  left: number\n  top: number\n  duration?: { x?: number; y?: number }\n  easing?: (t: number) => number\n  callback?: () => void\n}\n\nexport type getScrollDurationParams = {\n  parent: Element | Window\n  left: number\n  top: number\n  speed: number\n}\n\nexport type scrollToTargetParams = {\n  target: ScrollToTarget\n  parent?: ScrollToParent\n  offset?: {\n    x?: number\n    y?: number\n  }\n  speed?: number\n  easing?: (t: number) => number\n}\n\n// Private functions\nfunction min(a: number, b: number) {\n  return a < b ? a : b\n}\n\nfunction unwrapParent(parent: ScrollToParent) {\n  if (parent === window) {\n    return parent\n  } else if (typeof parent === 'string') {\n    return document.querySelector(parent) || document.documentElement\n  } else {\n    return (\n      unrefElement(parent as MaybeComputedElementRef<MaybeElement>) ||\n      document.documentElement\n    )\n  }\n}\n\nfunction unwrapTarget(target: ScrollToTarget, parentEl: Element | Window) {\n  if (typeof target === 'string') {\n    const queryTarget = parentEl === window ? document : (parentEl as Element)\n    return queryTarget.querySelector(target)\n  } else {\n    return unrefElement(target as MaybeComputedElementRef<MaybeElement>)\n  }\n}\n\nfunction isHtmlElement(\n  parentEl: Window | SVGElement | Element\n): parentEl is HTMLElement {\n  return parentEl instanceof HTMLElement\n}\n\nfunction disableScrollSnap(parentEl: Window | SVGElement | Element) {\n  if (isHtmlElement(parentEl)) {\n    parentEl.style.scrollSnapType = 'none'\n  }\n}\n\nfunction reenableScrollSnap(parentEl: Window | SVGElement | Element) {\n  if (isHtmlElement(parentEl)) {\n    parentEl.style.scrollSnapType = ''\n  }\n}\n\n// Public composable\nexport function useScrollTo() {\n  function getScrollPosition(element: Element | Window): {\n    x: number\n    y: number\n  } {\n    if (element === window) {\n      return { x: window.scrollX, y: window.scrollY }\n    } else if (element instanceof Element) {\n      return { x: element.scrollLeft, y: element.scrollTop }\n    } else {\n      return { x: 0, y: 0 }\n    }\n  }\n\n  function getDistance(\n    target: Element,\n    parent?: Element | Window\n  ): { top: number; left: number } {\n    const rect = target.getBoundingClientRect()\n    const scrollEl =\n      parent || document.scrollingElement || document.documentElement\n\n    const scrollTop = scrollEl instanceof Window ? 0 : scrollEl.scrollTop\n    const scrollLeft = scrollEl instanceof Window ? 0 : scrollEl.scrollLeft\n\n    return {\n      top: rect.top + scrollTop,\n      left: rect.left + scrollLeft,\n    }\n  }\n\n  function getScrollDuration({\n    parent = document.documentElement || document.body,\n    left = 0,\n    top = 0,\n    speed = 500,\n  }: getScrollDurationParams) {\n    const currentPos = getScrollPosition(parent)\n    const distanceX = currentPos.x - left\n    const distanceY = currentPos.y - top\n    const durationX = Math.abs((distanceX / speed) * 100)\n    const durationY = Math.abs((distanceY / speed) * 100)\n\n    return { x: durationX, y: durationY }\n  }\n\n  function scrollTo({\n    parent = document.documentElement || document.body,\n    top,\n    left,\n    duration = {},\n    easing = easeOutQuad,\n    callback,\n  }: ScrollToParams) {\n    const startTime = Date.now()\n    const { x: fromX, y: fromY } = getScrollPosition(parent)\n\n    if (fromX === top && fromY === left) {\n      if (callback) {\n        callback()\n      }\n      return\n    }\n\n    const mappedDuration = { x: 500, y: 500, ...duration }\n\n    const scroll = () => {\n      const currentTime = Date.now()\n\n      const timeX = min(1, (currentTime - startTime) / mappedDuration.x)\n      const timeY = min(1, (currentTime - startTime) / mappedDuration.y)\n      const easedTimeX = easing(timeX)\n      const easedTimeY = easing(timeY)\n\n      // We use the min of the two times to make sure we scroll at the same speed\n      const minTime = Math.min(easedTimeX, easedTimeY)\n\n      parent.scroll({\n        left: minTime * (left - fromX) + fromX,\n        top: minTime * (top - fromY) + fromY,\n      })\n\n      if (easedTimeX < 1 || easedTimeY < 1) {\n        requestAnimationFrame(scroll)\n      } else if (callback) {\n        callback()\n      }\n    }\n\n    requestAnimationFrame(scroll)\n  }\n\n  function scrollToTarget({\n    target,\n    parent = document.documentElement || document.body,\n    offset = {},\n    speed = 500,\n    easing = easeOutQuad,\n  }: scrollToTargetParams) {\n    const parentEl = unwrapParent(parent)\n    if (!parentEl) {\n      return\n    }\n    const targetEl = unwrapTarget(target, parentEl)\n    if (!targetEl) {\n      return\n    }\n\n    disableScrollSnap(parentEl)\n\n    const mappedOffset = { x: 0, y: 0, ...offset }\n    const distance = getDistance(targetEl, parentEl)\n    const leftDistance = distance.left - mappedOffset.x\n    const topDistance = distance.top - mappedOffset.y\n\n    const scrollDuration = getScrollDuration({\n      parent: parentEl,\n      left: leftDistance,\n      top: topDistance,\n      speed: speed,\n    })\n\n    scrollTo({\n      parent: parentEl,\n      left: leftDistance,\n      top: topDistance,\n      duration: scrollDuration,\n      easing: easing,\n      callback: () => reenableScrollSnap(parentEl),\n    })\n  }\n\n  return {\n    getScrollPosition,\n    getDistance,\n    getScrollDuration,\n    scrollTo,\n    scrollToTarget,\n  }\n}\n"],"mappings":"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","names":[]}

package/dist/nuxt/module.json

@@ -1,7 +1,7 @@
 {
   "name": "@maas/vue-equipment/nuxt",
   "configKey": "vueEquipment",
-  "version": "1.0.0-beta.56",
+  "version": "1.0.0-beta.57",
   "builder": {
     "@nuxt/module-builder": "1.0.2",
     "unbuild": "unknown"

package/dist/nuxt/module.mjs

@@ -137,7 +137,7 @@ const functions$1 = [
 	{
 		name: "useScrollTo",
 		"package": "composables",
-		lastUpdated: 1757314730000,
+		lastUpdated: 1780311933000,
 		docs: "https://maas.egineering/vue-equipment/composables/useScrollTo/",
 		description: "Scroll to an element with consistent speed"
 	}

package/dist/plugins/MagicCommand/src/composables/private/useCommandView.mjs

@@ -68,7 +68,9 @@ export function useCommandView(id) {
     let view = viewMap.get(id2);
     if (!view) {
       view = state.views.find((v) => v.id === id2);
-      if (view) viewMap.set(id2, view);
+      if (view) {
+        viewMap.set(id2, view);
+      }
     }
     return view;
   }

package/dist/plugins/MagicCookie/src/components/MagicCookieProvider.d.vue.ts

@@ -4,9 +4,9 @@ type MagicCookieProviderProps = {
     id: MaybeRef<string>;
     options?: MagicCookieOptions;
 };
-declare var __VLS_7: {};
+declare var __VLS_1: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_7) => any;
+    default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<MagicCookieProviderProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MagicCookieProviderProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/dist/plugins/MagicCookie/src/components/MagicCookieProvider.vue

@@ -1,9 +1,7 @@
 <template>
-  <client-only>
-    <div class="magic-cookie-provider" v-bind="$attrs">
-      <slot />
-    </div>
-  </client-only>
+  <div class="magic-cookie-provider">
+    <slot />
+  </div>
 </template>
 
 <script setup>
@@ -12,9 +10,6 @@ import { defu } from "defu";
 import { useCookieState } from "../composables/private/useCookieState";
 import { defaultOptions } from "../utils/defaultOptions";
 import { MagicCookieInstanceId } from "../symbols";
-defineOptions({
-  inheritAttrs: false
-});
 const { id, options } = defineProps({
   id: { type: null, required: true },
   options: { type: Object, required: false }

package/dist/plugins/MagicCookie/src/components/MagicCookieProvider.vue.d.ts

@@ -4,9 +4,9 @@ type MagicCookieProviderProps = {
     id: MaybeRef<string>;
     options?: MagicCookieOptions;
 };
-declare var __VLS_7: {};
+declare var __VLS_1: {};
 type __VLS_Slots = {} & {
-    default?: (props: typeof __VLS_7) => any;
+    default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<MagicCookieProviderProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MagicCookieProviderProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

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

@@ -309,15 +309,15 @@ onUnmounted(() => {
   --magic-drawer-padding: 0px;
   --magic-drawer-drag-overshoot-x: 0px;
   --magic-drawer-drag-overshoot-y: 0px;
-  position: fixed;
-  inset: 0;
-  width: 100%;
-  height: 100%;
-  display: flex;
-  pointer-events: none;
+  position: var(--magic-drawer-position, fixed);
+  inset: var(--magic-drawer-inset, 0);
+  display: var(--magic-drawer-display, flex);
   justify-content: var(--magic-drawer-justify-content);
   align-items: var(--magic-drawer-align-items);
   z-index: var(--magic-drawer-z-index, 999);
+  width: 100%;
+  height: 100%;
+  pointer-events: none;
   background: transparent;
   color: inherit;
   padding: 0;
@@ -402,8 +402,8 @@ onUnmounted(() => {
 }
 
 .magic-drawer__content {
-  width: 100%;
-  max-height: 100%;
+  width: var(--magic-drawer-content-width, 100%);
+  max-height: var(--magic-drawer-content-max-height, 100%);
   height: var(--magic-drawer-content-height, 100%);
   position: relative;
 }

package/dist/plugins/MagicDrawer/src/composables/private/useDrawerDrag.mjs

@@ -217,28 +217,36 @@ export function useDrawerDrag(args) {
     switch (position) {
       case "bottom": {
         const newDraggedB = clamp(y - originY.value, 0, os * -1, false);
-        if (newDraggedB === draggedY.value) break;
+        if (newDraggedB === draggedY.value) {
+          break;
+        }
         relDirectionY.value = newDraggedB < draggedY.value ? "below" : "above";
         draggedY.value = newDraggedB;
         break;
       }
       case "top": {
         const newDraggedT = clamp(y - originY.value, 0, os, true);
-        if (newDraggedT === draggedY.value) break;
+        if (newDraggedT === draggedY.value) {
+          break;
+        }
         relDirectionY.value = newDraggedT < draggedY.value ? "below" : "above";
         draggedY.value = newDraggedT;
         break;
       }
       case "right": {
         const newDraggedR = clamp(x - originX.value, 0, os * -1, false);
-        if (newDraggedR === draggedX.value) break;
+        if (newDraggedR === draggedX.value) {
+          break;
+        }
         relDirectionX.value = newDraggedR < draggedX.value ? "below" : "above";
         draggedX.value = newDraggedR;
         break;
       }
       case "left": {
         const newDraggedL = clamp(x - originX.value, 0, os, true);
-        if (newDraggedL === draggedX.value) break;
+        if (newDraggedL === draggedX.value) {
+          break;
+        }
         relDirectionX.value = newDraggedL < draggedX.value ? "below" : "above";
         draggedX.value = newDraggedL;
         break;

package/dist/plugins/MagicDrawer/src/composables/private/useDrawerGuards.mjs

@@ -9,6 +9,9 @@ export function useDrawerGuards(args) {
     return toValue(activeSnapPoint) !== 1 && !!toValue(activeSnapPoint);
   });
   function canScrollY(element) {
+    if (!(element instanceof Element)) {
+      return false;
+    }
     const style = window.getComputedStyle(element);
     const overflowY = style.overflowY;
     const canScroll = ["auto", "scroll"].includes(overflowY);
@@ -16,6 +19,9 @@ export function useDrawerGuards(args) {
     return canScroll && hasOverflow;
   }
   function canScrollX(element) {
+    if (!(element instanceof Element)) {
+      return false;
+    }
     const style = window.getComputedStyle(element);
     const overflowX = style.overflowX;
     const canScroll = ["auto", "scroll"].includes(overflowX);

package/dist/plugins/MagicDrawer/src/composables/private/useDrawerProgress.mjs

@@ -82,8 +82,12 @@ export function useDrawerProgress(args) {
         );
         break;
     }
-    rawX = rawX === -0 ? 0 : rawX;
-    rawY = rawY === -0 ? 0 : rawY;
+    if (Object.is(rawX, -0)) {
+      rawX = 0;
+    }
+    if (Object.is(rawY, -0)) {
+      rawY = 0;
+    }
     const x = clampValue(rawX, 0, 1);
     const y = clampValue(rawY, 0, 1);
     progress.value = { x, y };

package/dist/plugins/MagicEmitter/src/composables/useMagicEmitter.d.ts

@@ -74,26 +74,26 @@ export declare function useMagicEmitter(): {
         } & Omit<{
             beforeSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             snapTo: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
                 duration?: number;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
                 duration?: number;
             };
             afterSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             beforeDrag: {
                 id: string;
@@ -341,26 +341,26 @@ export declare function useMagicEmitter(): {
         } & Omit<{
             beforeSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             snapTo: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
                 duration?: number;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
                 duration?: number;
             };
             afterSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             beforeDrag: {
                 id: string;
@@ -610,26 +610,26 @@ export declare function useMagicEmitter(): {
         } & Omit<{
             beforeSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             snapTo: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
                 duration?: number;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
                 duration?: number;
             };
             afterSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             beforeDrag: {
                 id: string;
@@ -877,26 +877,26 @@ export declare function useMagicEmitter(): {
         } & Omit<{
             beforeSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             snapTo: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
                 duration?: number;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
                 duration?: number;
             };
             afterSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             beforeDrag: {
                 id: string;
@@ -1146,26 +1146,26 @@ export declare function useMagicEmitter(): {
         } & Omit<{
             beforeSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             snapTo: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
                 duration?: number;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
                 duration?: number;
             };
             afterSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             beforeDrag: {
                 id: string;
@@ -1413,26 +1413,26 @@ export declare function useMagicEmitter(): {
         } & Omit<{
             beforeSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             snapTo: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
                 duration?: number;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
                 duration?: number;
             };
             afterSnap: {
                 id: string;
-                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
+                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
             } | {
                 id: string;
-                snapPoint: import("../../../MagicDraggable/src/types/index.js").DraggableSnapPoint;
+                snapPoint: import("../../../MagicDrawer/src/types/index.js").DrawerSnapPoint;
             };
             beforeDrag: {
                 id: string;

package/dist/plugins/MagicMenu/src/composables/private/useMenuView.mjs

@@ -64,7 +64,9 @@ export function useMenuView(instanceId) {
     let view = viewMap.get(id);
     if (!view) {
       view = state.views.find((v) => v.id === id);
-      if (view) viewMap.set(id, view);
+      if (view) {
+        viewMap.set(id, view);
+      }
     }
     return view;
   }

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

@@ -35,9 +35,9 @@
         @after-leave="onAfterLeave"
       >
         <component
-          ref="component"
           :is="mappedOptions.tag"
           v-show="innerActive"
+          ref="component"
           class="magic-modal__content"
           @pointerdown.self="onPointerdown"
         >
@@ -183,13 +183,13 @@ onUnmounted(() => {
 }
 
 .magic-modal {
-  position: fixed;
-  inset: 0;
-  width: 100%;
-  height: 100%;
-  display: flex;
-  justify-content: center;
-  align-items: center;
+  position: var(--magic-modal-position, fixed);
+  inset: var(--magic-modal-inset, 0);
+  width: var(--magic-modal-width, 100%);
+  height: var(--magic-modal-height, 100%);
+  display: var(--magic-modal-display, flex);
+  justify-content: var(--magic-modal-justify-content, center);
+  align-items: var(--magic-modal-align-items, center);
   z-index: var(--magic-modal-z-index, 999);
   background: transparent;
   color: inherit;
@@ -200,9 +200,9 @@ onUnmounted(() => {
 .magic-modal__content {
   -webkit-overflow-scrolling: touch;
   scroll-behavior: smooth;
-  max-height: 100%;
-  width: 100%;
-  display: flex;
+  max-height: var(--magic-modal-content-max-height, 100%);
+  width: var(--magic-modal-content-width, 100%);
+  display: var(--magic-modal-content-display, flex);
   align-items: var(--magic-modal-content-align-items, center);
   justify-content: var(--magic-modal-content-justify-content, center);
   overflow-y: var(--magic-modal-content-overflow-y, auto);

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

@@ -29,7 +29,8 @@ import { audioModePlaybackDefaults } from "../utils/playbackDefaults";
 import {
   MagicPlayerInstanceId,
   MagicPlayerOptionsKey,
-  MagicPlayerRef
+  MagicPlayerRef,
+  MagicPlayerCurrentSrcKey
 } from "../symbols";
 const magicError = useMagicError({
   prefix: "MagicPlayer",
@@ -38,6 +39,7 @@ const magicError = useMagicError({
 const injectedInstanceId = inject(MagicPlayerInstanceId, void 0);
 const injectedOptions = inject(MagicPlayerOptionsKey, void 0);
 const injectedPlayerRef = inject(MagicPlayerRef, void 0);
+const injectedCurrentSrc = inject(MagicPlayerCurrentSrcKey, void 0);
 let cancelFocus = void 0;
 let cancelBlur = void 0;
 magicError.assert(injectedInstanceId, {
@@ -52,7 +54,7 @@ const elRef = useTemplateRef("el");
 const { initialize } = usePlayerRuntime({
   id: injectedInstanceId,
   mediaRef: elRef,
-  src: injectedOptions.src,
+  src: injectedCurrentSrc,
   srcType: injectedOptions.srcType,
   debug: injectedOptions.debug
 });

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

@@ -29,7 +29,11 @@ import {
   useMagicError
 } from "@maas/vue-equipment/plugins/MagicError";
 import { usePlayerState } from "../composables/private/usePlayerState";
-import { MagicPlayerInstanceId, MagicPlayerOptionsKey } from "../symbols";
+import {
+  MagicPlayerInstanceId,
+  MagicPlayerOptionsKey,
+  MagicPlayerCurrentSrcKey
+} from "../symbols";
 const { playbackId } = defineProps({
   playbackId: { type: String, required: false }
 });
@@ -39,6 +43,7 @@ const magicError = useMagicError({
 });
 const instanceId = inject(MagicPlayerInstanceId, void 0);
 const injectedOptions = inject(MagicPlayerOptionsKey, void 0);
+const injectedCurrentSrc = inject(MagicPlayerCurrentSrcKey, void 0);
 magicError.assert(instanceId, {
   message: "MagicPlayerMuxPopover must be nested inside MagicPlayerVideoControls",
   errorCode: "missing_instance_id"
@@ -107,7 +112,7 @@ function drawFrame(time) {
   );
 }
 async function initialize() {
-  const parsedPlaybackId = getMuxId(injectedOptions?.src);
+  const parsedPlaybackId = getMuxId(injectedCurrentSrc?.value);
   const mappedPlaybackId = playbackId ?? parsedPlaybackId;
   if (!mappedPlaybackId) {
     magicError.throwError({

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

@@ -83,7 +83,8 @@ const {
   muted,
   loaded,
   waiting,
-  hasOverlay
+  hasOverlay,
+  skipping
 } = toRefs(state);
 hasOverlay.value = true;
 const mappedOverlayTransition = computed(
@@ -98,6 +99,7 @@ const { togglePlay } = usePlayerVideoApi({
 const { idle } = useIdle(injectedOptions?.threshold?.idle);
 const isVisible = computed(() => {
   switch (true) {
+    case skipping.value:
     case (playing.value && idle.value):
     case (playing.value && !mouseEntered.value):
     case (injectedOptions?.autoplay && (!started.value || !mouseEntered.value)):

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

@@ -21,13 +21,22 @@
 </template>
 
 <script setup>
-import { toRefs, provide, onMounted, useTemplateRef } from "vue";
+import {
+  toRefs,
+  provide,
+  onMounted,
+  useTemplateRef,
+  computed,
+  watch
+} from "vue";
 import defu from "defu";
 import { usePlayerState } from "../composables/private/usePlayerState";
+import { usePlayerPlaylistApi } from "../composables/private/usePlayerPlaylistApi";
 import {
   MagicPlayerInstanceId,
   MagicPlayerOptionsKey,
-  MagicPlayerRef
+  MagicPlayerRef,
+  MagicPlayerCurrentSrcKey
 } from "../symbols";
 import { defaultOptions } from "../utils/defaultOptions";
 import { usePlayerEmitter } from "../composables/private/usePlayerEmitter";
@@ -49,6 +58,20 @@ const {
   fullscreen,
   touched
 } = toRefs(state);
+const rawSrc = options?.src ?? "";
+const srcs = Array.isArray(rawSrc) ? rawSrc : [rawSrc];
+state.playlistCount = srcs.length;
+state.loop = mappedOptions.loop;
+const currentSrc = computed(() => srcs[state.playlistIndex] ?? "");
+const { next } = usePlayerPlaylistApi({ id });
+watch(
+  () => state.ended,
+  (value) => {
+    if (value && state.playlistCount > 1) {
+      next();
+    }
+  }
+);
 const { onMouseenter, onMouseleave, onPointerdown } = usePlayerProvider(id);
 const playerRef = useTemplateRef("player");
 const { initializeEmitter } = usePlayerEmitter({ id });
@@ -58,6 +81,7 @@ onMounted(() => {
 provide(MagicPlayerInstanceId, id);
 provide(MagicPlayerOptionsKey, mappedOptions);
 provide(MagicPlayerRef, playerRef);
+provide(MagicPlayerCurrentSrcKey, currentSrc);
 </script>
 
 <style>

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

@@ -5,7 +5,7 @@
     playsinline
     disablePictureInPicture
     :preload="injectedOptions.preload"
-    :loop="injectedOptions.loop"
+    :loop="playlistCount <= 1 && injectedOptions.loop"
     :muted="muted"
   />
 </template>
@@ -37,7 +37,8 @@ import { videoModePlaybackDefaults } from "../utils/playbackDefaults";
 import {
   MagicPlayerInstanceId,
   MagicPlayerOptionsKey,
-  MagicPlayerRef
+  MagicPlayerRef,
+  MagicPlayerCurrentSrcKey
 } from "../symbols";
 const magicError = useMagicError({
   prefix: "MagicPlayer",
@@ -46,6 +47,7 @@ const magicError = useMagicError({
 const injectedInstanceId = inject(MagicPlayerInstanceId, void 0);
 const injectedOptions = inject(MagicPlayerOptionsKey, void 0);
 const injectedPlayerRef = inject(MagicPlayerRef, void 0);
+const injectedCurrentSrc = inject(MagicPlayerCurrentSrcKey, void 0);
 let cancelFocus = void 0;
 let cancelBlur = void 0;
 magicError.assert(injectedInstanceId, {
@@ -60,13 +62,13 @@ const elRef = useTemplateRef("el");
 const { initialize } = usePlayerRuntime({
   id: injectedInstanceId,
   mediaRef: elRef,
-  src: injectedOptions.src,
+  src: injectedCurrentSrc,
   srcType: injectedOptions.srcType,
   debug: injectedOptions.debug
 });
 const { initializeState } = usePlayerState(injectedInstanceId);
 const state = initializeState();
-const { muted, playing, started, loaded } = toRefs(state);
+const { muted, playing, started, loaded, playlistCount } = toRefs(state);
 usePlayerMediaApi({
   id: injectedInstanceId,
   mediaRef: elRef

package/dist/plugins/MagicPlayer/src/composables/private/usePlayerMediaApi.mjs

@@ -76,8 +76,9 @@ export function usePlayerMediaApi(args) {
   }
   function timeRangeToArray(timeRanges) {
     let ranges = [];
-    for (let i = 0; i < timeRanges.length; ++i)
+    for (let i = 0; i < timeRanges.length; ++i) {
       ranges = [...ranges, [timeRanges.start(i), timeRanges.end(i)]];
+    }
     return ranges;
   }
   watch(volume, () => {

package/dist/plugins/MagicPlayer/src/composables/private/usePlayerPlaylistApi.d.ts

@@ -0,0 +1,10 @@
+import { type MaybeRef } from 'vue';
+export type UsePlayerPlaylistApiArgs = {
+    id: MaybeRef<string>;
+};
+export declare function usePlayerPlaylistApi(args: UsePlayerPlaylistApiArgs): {
+    next: () => void;
+    prev: () => void;
+    goTo: (index: number) => void;
+};
+export type UsePlayerPlaylistApiReturn = ReturnType<typeof usePlayerPlaylistApi>;

package/dist/plugins/MagicPlayer/src/composables/private/usePlayerPlaylistApi.mjs

@@ -0,0 +1,27 @@
+import { toValue } from "vue";
+import { usePlayerState } from "./usePlayerState.mjs";
+export function usePlayerPlaylistApi(args) {
+  const { id } = args;
+  const { initializeState } = usePlayerState(toValue(id));
+  const state = initializeState();
+  function next() {
+    if (state.playlistIndex < state.playlistCount - 1) {
+      state.playlistIndex++;
+    } else if (state.loop) {
+      state.playlistIndex = 0;
+    }
+  }
+  function prev() {
+    if (state.playlistIndex > 0) {
+      state.playlistIndex--;
+    } else if (state.loop) {
+      state.playlistIndex = state.playlistCount - 1;
+    }
+  }
+  function goTo(index) {
+    if (index >= 0 && index < state.playlistCount) {
+      state.playlistIndex = index;
+    }
+  }
+  return { next, prev, goTo };
+}

package/dist/plugins/MagicPlayer/src/composables/private/usePlayerRuntime.d.ts

@@ -4,7 +4,7 @@ export type UsePlayerRuntimeArgs = {
     id: MaybeRef<string>;
     mediaRef?: Ref<HTMLVideoElement | HTMLAudioElement | null>;
     srcType?: MagicPlayerOptions['srcType'];
-    src?: string;
+    src?: MaybeRef<string>;
     debug?: boolean;
 };
 export declare function usePlayerRuntime(args: UsePlayerRuntimeArgs): {

package/dist/plugins/MagicPlayer/src/composables/private/usePlayerRuntime.mjs

@@ -2,7 +2,8 @@ import {
   onScopeDispose,
   shallowRef,
   toRefs,
-  toValue
+  toValue,
+  watch
 } from "vue";
 import { useEventListener } from "@vueuse/core";
 import { useMagicError } from "@maas/vue-equipment/plugins/MagicError";
@@ -21,6 +22,8 @@ export function usePlayerRuntime(args) {
   let cancelLoaded = void 0;
   let cancelPlay = void 0;
   let cancelPause = void 0;
+  let cancelResumeOnLoad = void 0;
+  let initialized = false;
   function handleHlsRuntimeError(args2) {
     const { data, hls: hls2 } = args2;
     const error = new Error(data.details || "HLS error");
@@ -75,11 +78,12 @@ export function usePlayerRuntime(args) {
       return;
     }
     const el = toValue(mediaRef);
-    if (!el || !src) {
+    const currentSrc = toValue(src);
+    if (!el || !currentSrc) {
       return;
     }
     try {
-      el.src = src;
+      el.src = currentSrc;
       cancelLoaded?.();
       cancelLoaded = useEventListener(
         mediaRef,
@@ -102,6 +106,10 @@ export function usePlayerRuntime(args) {
     if (!el) {
       return;
     }
+    const currentSrc = toValue(src);
+    if (!currentSrc) {
+      return;
+    }
     deferredLoading.value = autoplay;
     try {
       const { default: Hls } = await import("hls.js");
@@ -110,9 +118,6 @@ export function usePlayerRuntime(args) {
         useNative();
         return;
       }
-      if (!src) {
-        return;
-      }
       hls.on(Hls.Events.FRAG_LOADED, () => {
         loaded.value = true;
       });
@@ -135,7 +140,7 @@ export function usePlayerRuntime(args) {
       cancelPlay = useEventListener(mediaRef, "play", () => {
         hls?.startLoad();
       });
-      hls.loadSource(src);
+      hls.loadSource(currentSrc);
       hls.attachMedia(el);
     } catch (error) {
       throwError({
@@ -149,6 +154,7 @@ export function usePlayerRuntime(args) {
     cancelLoaded?.();
     cancelPlay?.();
     cancelPause?.();
+    cancelResumeOnLoad?.();
     try {
       hls?.destroy();
     } finally {
@@ -156,7 +162,46 @@ export function usePlayerRuntime(args) {
       deferredLoading.value = false;
     }
   }
+  function resetState() {
+    state.playing = false;
+    state.loaded = false;
+    state.started = false;
+    state.ended = false;
+    state.currentTime = 0;
+    state.duration = 0;
+    state.buffered = [];
+    state.waiting = false;
+    state.stalled = false;
+  }
+  watch(
+    () => state.playlistIndex,
+    (newIndex, oldIndex) => {
+      if (!initialized || newIndex === oldIndex || state.playlistCount <= 1) {
+        return;
+      }
+      const wasPlaying = state.playing;
+      state.skipping = true;
+      resetState();
+      destroy();
+      cancelResumeOnLoad = watch(loaded, (value) => {
+        if (value) {
+          state.skipping = false;
+          if (wasPlaying) {
+            state.playing = true;
+          }
+          cancelResumeOnLoad?.();
+          cancelResumeOnLoad = void 0;
+        }
+      });
+      if (srcType === "native") {
+        useNative();
+      } else if (srcType === "hls") {
+        useHlsJS(wasPlaying);
+      }
+    }
+  );
   function initialize(autoplay = false) {
+    initialized = true;
     if (srcType === "native") {
       useNative();
     } else if (srcType === "hls") {

package/dist/plugins/MagicPlayer/src/composables/private/usePlayerState.mjs

@@ -40,7 +40,11 @@ export function usePlayerState(id) {
       hasControls: false,
       controlsBarRect: void 0,
       controlsTrackRect: void 0,
-      controlsPopoverRect: void 0
+      controlsPopoverRect: void 0,
+      playlistIndex: 0,
+      playlistCount: 0,
+      loop: false,
+      skipping: false
     };
     return reactive(state);
   }

package/dist/plugins/MagicPlayer/src/composables/useMagicPlayer.d.ts

@@ -22,6 +22,12 @@ export declare function useMagicPlayer(id: MaybeRef<string>): {
     scrubbedPercentage: import("vue").Ref<number, number>;
     thumbPercentage: import("vue").Ref<number, number>;
     popoverOffsetX: import("vue").Ref<number | null, number | null>;
+    playlistIndex: import("vue").Ref<number, number>;
+    playlistCount: import("vue").Ref<number, number>;
+    skipping: import("vue").Ref<boolean, boolean>;
+    next: () => void;
+    prev: () => void;
+    goTo: (index: number) => void;
     audioApi: {
         play: () => void;
         pause: () => void;

package/dist/plugins/MagicPlayer/src/composables/useMagicPlayer.mjs

@@ -4,11 +4,13 @@ import { usePlayerAudioApi } from "./private/usePlayerAudioApi.mjs";
 import { usePlayerRuntime } from "./private/usePlayerRuntime.mjs";
 import { usePlayerControlsApi } from "./private/usePlayerControlsApi.mjs";
 import { usePlayerState } from "./private/usePlayerState.mjs";
+import { usePlayerPlaylistApi } from "./private/usePlayerPlaylistApi.mjs";
 export function useMagicPlayer(id) {
   const audioApi = usePlayerAudioApi({ id });
   const videoApi = usePlayerVideoApi({ id });
   const controlsApi = usePlayerControlsApi({ id });
   const playerRuntime = usePlayerRuntime({ id });
+  const { next, prev, goTo } = usePlayerPlaylistApi({ id });
   const { initializeState } = usePlayerState(id);
   const state = initializeState();
   const {
@@ -33,7 +35,10 @@ export function useMagicPlayer(id) {
     seekedPercentage,
     scrubbedPercentage,
     thumbPercentage,
-    popoverOffsetX
+    popoverOffsetX,
+    playlistIndex,
+    playlistCount,
+    skipping
   } = toRefs(state);
   return {
     duration,
@@ -58,6 +63,12 @@ export function useMagicPlayer(id) {
     scrubbedPercentage,
     thumbPercentage,
     popoverOffsetX,
+    playlistIndex,
+    playlistCount,
+    skipping,
+    next,
+    prev,
+    goTo,
     audioApi,
     videoApi,
     controlsApi,

package/dist/plugins/MagicPlayer/src/symbols/index.d.ts

@@ -1,9 +1,10 @@
-import type { InjectionKey, MaybeRef, Ref } from 'vue';
+import type { ComputedRef, InjectionKey, MaybeRef, Ref } from 'vue';
 import type { MagicPlayerOptions } from '../types/index.js';
 declare const MagicPlayerInstanceId: InjectionKey<MaybeRef<string>>;
 declare const MagicPlayerOptionsKey: InjectionKey<MagicPlayerOptions>;
 declare const MagicPlayerRef: InjectionKey<Ref<HTMLDivElement | null>>;
+declare const MagicPlayerCurrentSrcKey: InjectionKey<ComputedRef<string>>;
 declare const MagicPlayerTrackRef: InjectionKey<Ref<HTMLDivElement | null>>;
 declare const MagicPlayerBarRef: InjectionKey<Ref<HTMLDivElement | null>>;
 declare const MagicPlayerPopoverRef: InjectionKey<Ref<HTMLDivElement | null>>;
-export { MagicPlayerInstanceId, MagicPlayerOptionsKey, MagicPlayerRef, MagicPlayerTrackRef, MagicPlayerBarRef, MagicPlayerPopoverRef, };
+export { MagicPlayerInstanceId, MagicPlayerOptionsKey, MagicPlayerRef, MagicPlayerCurrentSrcKey, MagicPlayerTrackRef, MagicPlayerBarRef, MagicPlayerPopoverRef, };

package/dist/plugins/MagicPlayer/src/symbols/index.mjs

@@ -1,6 +1,7 @@
 const MagicPlayerInstanceId = Symbol();
 const MagicPlayerOptionsKey = Symbol();
 const MagicPlayerRef = Symbol();
+const MagicPlayerCurrentSrcKey = Symbol();
 const MagicPlayerTrackRef = Symbol();
 const MagicPlayerBarRef = Symbol();
 const MagicPlayerPopoverRef = Symbol();
@@ -8,6 +9,7 @@ export {
   MagicPlayerInstanceId,
   MagicPlayerOptionsKey,
   MagicPlayerRef,
+  MagicPlayerCurrentSrcKey,
   MagicPlayerTrackRef,
   MagicPlayerBarRef,
   MagicPlayerPopoverRef

package/dist/plugins/MagicPlayer/src/types/index.d.ts

@@ -1,6 +1,6 @@
 type PlayerMode = 'audio' | 'video';
 export interface MagicPlayerOptions {
-    src: string;
+    src: string | string[];
     mode?: PlayerMode;
     srcType?: 'native' | 'hls';
     preload?: 'auto' | 'metadata' | 'none';
@@ -18,7 +18,7 @@ export interface MagicPlayerOptions {
     };
 }
 export interface RequiredMagicPlayerOptions {
-    src: string;
+    src: string | string[];
     mode: 'audio' | 'video';
     srcType: 'native' | 'hls';
     preload: 'auto' | 'metadata' | 'none';
@@ -68,6 +68,10 @@ export interface PlayerState {
     controlsBarRect: DOMRect | undefined;
     controlsTrackRect: DOMRect | undefined;
     controlsPopoverRect: DOMRect | undefined;
+    playlistIndex: number;
+    playlistCount: number;
+    loop: boolean;
+    skipping: boolean;
 }
 export interface PlayerEvents {
     onDragStart: string;

package/dist/plugins/MagicToast/src/components/MagicToastProvider.vue

@@ -35,7 +35,11 @@
             v-bind="view.props"
             @remove="deleteView(view.id)"
           >
-            <template v-for="(slot, name) in view.slots" #[name]="slotProps">
+            <template
+              v-for="(slot, name) in view.slots"
+              :key="name"
+              #[name]="slotProps"
+            >
               <component :is="slot" v-bind="slotProps" />
             </template>
           </component>

package/dist/plugins/tsconfig.test.json

@@ -0,0 +1,8 @@
+{
+  "extends": "./tsconfig.json",
+  "compilerOptions": {
+    "moduleResolution": "bundler",
+    "types": ["vitest/globals"]
+  },
+  "include": ["**/tests/**/*.ts", "**/src/**/*.ts", "**/src/**/*.vue", "shims-vue.d.ts", "tests/**/*.ts"]
+}

package/dist/utils/index.js

@@ -104,7 +104,9 @@ function interpolate(args) {
   let startTime;
   let interpolationId;
   function animate(timestamp) {
-    if (!startTime) startTime = timestamp;
+    if (!startTime) {
+      startTime = timestamp;
+    }
     const progress = Math.min(1, (timestamp - startTime) / duration);
     const easedProgress = easing(progress);
     const value = from + (to - from) * easedProgress;
@@ -212,8 +214,12 @@ function slugify(string, options) {
   const charMap = {};
   let slug = string.normalize().split("").reduce(function(result, ch) {
     let appendChar = charMap[ch];
-    if (appendChar === void 0) appendChar = ch;
-    if (appendChar === (_options == null ? void 0 : _options.separator)) appendChar = " ";
+    if (appendChar === void 0) {
+      appendChar = ch;
+    }
+    if (appendChar === (_options == null ? void 0 : _options.separator)) {
+      appendChar = " ";
+    }
     return result + appendChar.replace((_options == null ? void 0 : _options.remove) || /[^\w\s$*_+~.()'"!\-:@]+/g, "");
   }, "");
   if (_options.strict) {

package/dist/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../packages/utils/src/functions/clampValue.ts","../../packages/utils/src/functions/createStateStore.ts","../../packages/utils/src/functions/easings.ts","../../packages/utils/src/functions/toNumber.ts","../../packages/utils/src/functions/formatTime.ts","../../packages/utils/src/functions/interpolate.ts","../../packages/utils/src/functions/isAndroid.ts","../../packages/utils/src/functions/isIOS.ts","../../packages/utils/src/functions/isWithinRange.ts","../../packages/utils/src/functions/mapValue.ts","../../packages/utils/src/functions/matchClass.ts","../../packages/utils/src/functions/pointerCapture.ts","../../packages/utils/src/functions/scrollbarGutterSupport.ts","../../packages/utils/src/functions/scrollbarWidth.ts","../../packages/utils/src/functions/slugify.ts","../../packages/utils/src/functions/uniq.ts"],"sourcesContent":["export function clampValue(value: number, min: number, max: number) {\n  return value <= min ? min : value >= max ? max : value\n}\n","import { getCurrentInstance, ref, type Ref } from 'vue'\n\nexport type CreateStore<T> = () => Ref<T>\n\nexport function createStateStore<T>(\n  key: string,\n  setInitialValue: () => T\n): CreateStore<T> {\n  return function getOrCreateStore(): Ref<T> {\n    const instance = getCurrentInstance()\n    const app = instance?.appContext.app\n\n    // If no app instance is found, return a fresh store\n    if (!app || !key) {\n      return ref(setInitialValue()) as Ref<T>\n    }\n\n    // Create a global Map to hold all state stores\n    if (!app.config.globalProperties.__VEStateStores) {\n      app.config.globalProperties.__VEStateStores = new Map<string, Ref<T>>()\n    }\n\n    // Check if a store already exists for this app instance\n    let store = app.config.globalProperties.__VEStateStores.get(key)\n\n    // If no store exists for this app instance, create one\n    if (!store) {\n      store = ref(setInitialValue()) as Ref<T>\n      app.config.globalProperties.__VEStateStores.set(key, store)\n    }\n\n    return store\n  }\n}\n","export function linear(t: number) {\n  return t\n}\nexport function easeInQuad(t: number) {\n  return t * t\n}\nexport function easeOutQuad(t: number) {\n  return t * (2 - t)\n}\nexport function easeInOutQuad(t: number) {\n  return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t\n}\nexport function easeOutBack(t: number, o: number = 1.25) {\n  return 1 + (t - 1) * (t - 1) * ((o + 1) * (t - 1) + o)\n}\nexport function easeInCubic(t: number) {\n  return t * t * t\n}\nexport function easeOutCubic(t: number) {\n  return --t * t * t + 1\n}\nexport function easeInOutCubic(t: number) {\n  return t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1\n}\nexport function easeInQuart(t: number) {\n  return t * t * t * t\n}\nexport function easeOutQuart(t: number) {\n  return 1 - --t * t * t * t\n}\nexport function easeInOutQuart(t: number) {\n  return t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t\n}\nexport function easeInQuint(t: number) {\n  return t * t * t * t * t\n}\nexport function easeOutQuint(t: number) {\n  return 1 + --t * t * t * t * t\n}\nexport function easeInOutQuint(t: number) {\n  return t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t\n}\n","export function toNumber(value: string | number): number {\n  return typeof value === 'string' ? parseFloat(value) : Number(value)\n}\n","import { toNumber } from './toNumber'\n\nexport function formatTime(seconds: number, guide: number) {\n  seconds = seconds < 0 ? 0 : seconds\n  let s: string | number = Math.floor(seconds % 60)\n  let m: string | number = Math.floor((seconds / 60) % 60)\n  let h: string | number = Math.floor(seconds / 3600)\n  const gm = Math.floor((guide / 60) % 60)\n  const gh = Math.floor(guide / 3600)\n\n  // handle invalid times\n  if (isNaN(seconds) || seconds === Infinity) {\n    // '-' is false for all relational operators (e.g. <, >=) so this setting\n    // will add the minimum number of fields specified by the guide\n    h = m = s = '-'\n  }\n\n  // Check if we need to show hours\n  h = toNumber(h) > 0 || gh > 0 ? h + ':' : ''\n\n  // If hours are showing, we may need to add a leading zero.\n  // Always show at least one digit of minutes.\n  m = ((h || gm >= 10) && toNumber(m) < 10 ? '0' + m : m) + ':'\n\n  // Check if leading zero is need for seconds\n  s = toNumber(s) < 10 ? '0' + s : s\n\n  return h + m + s\n}\n","export type InterpolateArgs = {\n  from: number\n  to: number\n  duration: number\n  easing?: (t: number) => number\n  callback: (result: number) => void\n  interpolationIdCallback?: (id: number) => void\n}\n\nexport function interpolate(args: InterpolateArgs) {\n  const {\n    from,\n    to,\n    duration,\n    callback,\n    interpolationIdCallback = () => {},\n    easing = (t) => t * (2 - t),\n  } = args\n\n  let startTime: number\n  let interpolationId: number\n\n  function animate(timestamp: number) {\n    if (!startTime) startTime = timestamp\n\n    const progress = Math.min(1, (timestamp - startTime) / duration)\n    const easedProgress = easing(progress)\n    const value = from + (to - from) * easedProgress\n\n    callback(value)\n\n    if (progress < 1) {\n      interpolationId = requestAnimationFrame(animate)\n      interpolationIdCallback(interpolationId)\n    }\n  }\n\n  interpolationId = requestAnimationFrame(animate)\n\n  return interpolationId\n}\n","export function isAndroid() {\n  if (typeof window === 'undefined') {\n    return false\n  }\n  return /android/i.test(navigator?.userAgent)\n}\n","export function isIOS() {\n  if (typeof window === 'undefined') {\n    return false\n  }\n  return /iPad|iPhone|iPod/.test(navigator?.userAgent)\n}\n","interface isWithinRangeArgs {\n  input: number\n  base: number\n  threshold: number\n}\n\nexport function isWithinRange(args: isWithinRangeArgs): boolean {\n  const { input, base, threshold } = args\n  return input >= base - threshold && input <= base + threshold\n}\n","export function mapValue(\n  value: number,\n  inMin: number,\n  inMax: number,\n  outMin: number,\n  outMax: number\n) {\n  return ((value - inMin) * (outMax - outMin)) / (inMax - inMin) + outMin\n}\n","export function matchClass(el: Element, regex: RegExp) {\n  return Array.from(el.classList).some((className) => regex.test(className))\n}\n","interface GuardedSetPointerCaptureArgs {\n  event: PointerEvent\n  element?: Element | null\n  mouse?: boolean\n  debug?: boolean\n}\n\ninterface GuardedReleasePointerCaptureArgs {\n  event: PointerEvent\n  element?: Element | null\n}\n\nexport function guardedSetPointerCapture(\n  args: GuardedSetPointerCaptureArgs\n): void {\n  const { event, element, mouse, debug } = args\n  if (element && event.isPrimary && (mouse || event.pointerType !== 'mouse')) {\n    try {\n      const coalescedEvents: PointerEvent[] =\n        'getCoalescedEvents' in event ? event.getCoalescedEvents() : [event]\n\n      if (coalescedEvents.length > 0 || mouse) {\n        element?.setPointerCapture(event.pointerId)\n      }\n    } catch (error) {\n      if (debug) {\n        console.warn('Failed to set pointer capture:', error)\n      }\n    }\n  }\n}\n\nexport function guardedReleasePointerCapture(\n  args: GuardedReleasePointerCaptureArgs\n): void {\n  const { event, element } = args\n  if (element?.hasPointerCapture(event.pointerId)) {\n    element.releasePointerCapture(event.pointerId)\n  }\n}\n","export function scrollbarGutterSupport() {\n  return CSS.supports('scrollbar-gutter', 'stable')\n}\n","export function scrollbarWidth() {\n  const wrapper = document.createElement('div')\n  wrapper.style.position = 'absolute'\n  wrapper.style.visibility = 'hidden'\n  wrapper.style.overflow = 'hidden'\n  wrapper.style.width = '100px'\n  wrapper.style.height = '100px'\n  wrapper.style.top = '-9999px'\n\n  wrapper.innerHTML = '<div style=\"width: 200px; height: 200px;\"></div>'\n  document.body.appendChild(wrapper)\n\n  // Get the scrollbar width\n  const withoutScrollbar = wrapper.clientWidth\n  wrapper.style.overflow = 'scroll'\n  const withScrollbar = wrapper.clientWidth\n\n  // Clean up\n  document.body.removeChild(wrapper)\n\n  return Math.round(withoutScrollbar - withScrollbar)\n}\n","export interface SlugifyOptions {\n  separator?: string\n  trim?: boolean\n  remove?: RegExp\n  strict?: boolean\n  lowercase?: boolean\n}\n\nconst defaultOptions: SlugifyOptions = {\n  separator: '-',\n  trim: true,\n  remove: undefined,\n  strict: true,\n  lowercase: true,\n}\n\nexport function slugify(string: string, options?: SlugifyOptions): string {\n  if (typeof string !== 'string') {\n    throw new Error('slugify: string argument expected')\n  }\n\n  // Merge provided options with default options\n  const _options = { ...defaultOptions, ...options }\n\n  const charMap: { [key: string]: string } = {}\n\n  let slug = string\n    .normalize()\n    .split('')\n    .reduce(function (result, ch) {\n      let appendChar = charMap[ch]\n      if (appendChar === undefined) appendChar = ch\n      if (appendChar === _options?.separator) appendChar = ' '\n      return (\n        result +\n        appendChar.replace(_options?.remove || /[^\\w\\s$*_+~.()'\"!\\-:@]+/g, '')\n      )\n    }, '')\n\n  if (_options.strict) {\n    slug = slug.replace(/[^A-Za-z0-9\\s]/g, '')\n  }\n\n  if (_options.trim) {\n    slug = slug.trim()\n  }\n\n  if (_options.separator) {\n    slug = slug.replace(/ +/g, _options.separator)\n  }\n\n  if (_options.lowercase) {\n    slug = slug.toLocaleLowerCase()\n  }\n\n  return slug\n}\n","export function uniq<T extends unknown[]>(a: T) {\n  return Array.from(new Set(a))\n}\n"],"mappings":"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","names":[]}
+{"version":3,"sources":["../../packages/utils/src/functions/clampValue.ts","../../packages/utils/src/functions/createStateStore.ts","../../packages/utils/src/functions/easings.ts","../../packages/utils/src/functions/toNumber.ts","../../packages/utils/src/functions/formatTime.ts","../../packages/utils/src/functions/interpolate.ts","../../packages/utils/src/functions/isAndroid.ts","../../packages/utils/src/functions/isIOS.ts","../../packages/utils/src/functions/isWithinRange.ts","../../packages/utils/src/functions/mapValue.ts","../../packages/utils/src/functions/matchClass.ts","../../packages/utils/src/functions/pointerCapture.ts","../../packages/utils/src/functions/scrollbarGutterSupport.ts","../../packages/utils/src/functions/scrollbarWidth.ts","../../packages/utils/src/functions/slugify.ts","../../packages/utils/src/functions/uniq.ts"],"sourcesContent":["export function clampValue(value: number, min: number, max: number) {\n  return value <= min ? min : value >= max ? max : value\n}\n","import { getCurrentInstance, ref, type Ref } from 'vue'\n\nexport type CreateStore<T> = () => Ref<T>\n\nexport function createStateStore<T>(\n  key: string,\n  setInitialValue: () => T\n): CreateStore<T> {\n  return function getOrCreateStore(): Ref<T> {\n    const instance = getCurrentInstance()\n    const app = instance?.appContext.app\n\n    // If no app instance is found, return a fresh store\n    if (!app || !key) {\n      return ref(setInitialValue()) as Ref<T>\n    }\n\n    // Create a global Map to hold all state stores\n    if (!app.config.globalProperties.__VEStateStores) {\n      app.config.globalProperties.__VEStateStores = new Map<string, Ref<T>>()\n    }\n\n    // Check if a store already exists for this app instance\n    let store = app.config.globalProperties.__VEStateStores.get(key)\n\n    // If no store exists for this app instance, create one\n    if (!store) {\n      store = ref(setInitialValue()) as Ref<T>\n      app.config.globalProperties.__VEStateStores.set(key, store)\n    }\n\n    return store\n  }\n}\n","export function linear(t: number) {\n  return t\n}\nexport function easeInQuad(t: number) {\n  return t * t\n}\nexport function easeOutQuad(t: number) {\n  return t * (2 - t)\n}\nexport function easeInOutQuad(t: number) {\n  return t < 0.5 ? 2 * t * t : -1 + (4 - 2 * t) * t\n}\nexport function easeOutBack(t: number, o: number = 1.25) {\n  return 1 + (t - 1) * (t - 1) * ((o + 1) * (t - 1) + o)\n}\nexport function easeInCubic(t: number) {\n  return t * t * t\n}\nexport function easeOutCubic(t: number) {\n  return --t * t * t + 1\n}\nexport function easeInOutCubic(t: number) {\n  return t < 0.5 ? 4 * t * t * t : (t - 1) * (2 * t - 2) * (2 * t - 2) + 1\n}\nexport function easeInQuart(t: number) {\n  return t * t * t * t\n}\nexport function easeOutQuart(t: number) {\n  return 1 - --t * t * t * t\n}\nexport function easeInOutQuart(t: number) {\n  return t < 0.5 ? 8 * t * t * t * t : 1 - 8 * --t * t * t * t\n}\nexport function easeInQuint(t: number) {\n  return t * t * t * t * t\n}\nexport function easeOutQuint(t: number) {\n  return 1 + --t * t * t * t * t\n}\nexport function easeInOutQuint(t: number) {\n  return t < 0.5 ? 16 * t * t * t * t * t : 1 + 16 * --t * t * t * t * t\n}\n","export function toNumber(value: string | number): number {\n  return typeof value === 'string' ? parseFloat(value) : Number(value)\n}\n","import { toNumber } from './toNumber'\n\nexport function formatTime(seconds: number, guide: number) {\n  seconds = seconds < 0 ? 0 : seconds\n  let s: string | number = Math.floor(seconds % 60)\n  let m: string | number = Math.floor((seconds / 60) % 60)\n  let h: string | number = Math.floor(seconds / 3600)\n  const gm = Math.floor((guide / 60) % 60)\n  const gh = Math.floor(guide / 3600)\n\n  // handle invalid times\n  if (isNaN(seconds) || seconds === Infinity) {\n    // '-' is false for all relational operators (e.g. <, >=) so this setting\n    // will add the minimum number of fields specified by the guide\n    h = m = s = '-'\n  }\n\n  // Check if we need to show hours\n  h = toNumber(h) > 0 || gh > 0 ? h + ':' : ''\n\n  // If hours are showing, we may need to add a leading zero.\n  // Always show at least one digit of minutes.\n  m = ((h || gm >= 10) && toNumber(m) < 10 ? '0' + m : m) + ':'\n\n  // Check if leading zero is need for seconds\n  s = toNumber(s) < 10 ? '0' + s : s\n\n  return h + m + s\n}\n","export type InterpolateArgs = {\n  from: number\n  to: number\n  duration: number\n  easing?: (t: number) => number\n  callback: (result: number) => void\n  interpolationIdCallback?: (id: number) => void\n}\n\nexport function interpolate(args: InterpolateArgs) {\n  const {\n    from,\n    to,\n    duration,\n    callback,\n    interpolationIdCallback = () => {},\n    easing = (t) => t * (2 - t),\n  } = args\n\n  let startTime: number\n  let interpolationId: number\n\n  function animate(timestamp: number) {\n    if (!startTime) {\n      startTime = timestamp\n    }\n\n    const progress = Math.min(1, (timestamp - startTime) / duration)\n    const easedProgress = easing(progress)\n    const value = from + (to - from) * easedProgress\n\n    callback(value)\n\n    if (progress < 1) {\n      interpolationId = requestAnimationFrame(animate)\n      interpolationIdCallback(interpolationId)\n    }\n  }\n\n  interpolationId = requestAnimationFrame(animate)\n\n  return interpolationId\n}\n","export function isAndroid() {\n  if (typeof window === 'undefined') {\n    return false\n  }\n  return /android/i.test(navigator?.userAgent)\n}\n","export function isIOS() {\n  if (typeof window === 'undefined') {\n    return false\n  }\n  return /iPad|iPhone|iPod/.test(navigator?.userAgent)\n}\n","interface isWithinRangeArgs {\n  input: number\n  base: number\n  threshold: number\n}\n\nexport function isWithinRange(args: isWithinRangeArgs): boolean {\n  const { input, base, threshold } = args\n  return input >= base - threshold && input <= base + threshold\n}\n","export function mapValue(\n  value: number,\n  inMin: number,\n  inMax: number,\n  outMin: number,\n  outMax: number\n) {\n  return ((value - inMin) * (outMax - outMin)) / (inMax - inMin) + outMin\n}\n","export function matchClass(el: Element, regex: RegExp) {\n  return Array.from(el.classList).some((className) => regex.test(className))\n}\n","interface GuardedSetPointerCaptureArgs {\n  event: PointerEvent\n  element?: Element | null\n  mouse?: boolean\n  debug?: boolean\n}\n\ninterface GuardedReleasePointerCaptureArgs {\n  event: PointerEvent\n  element?: Element | null\n}\n\nexport function guardedSetPointerCapture(\n  args: GuardedSetPointerCaptureArgs\n): void {\n  const { event, element, mouse, debug } = args\n  if (element && event.isPrimary && (mouse || event.pointerType !== 'mouse')) {\n    try {\n      const coalescedEvents: PointerEvent[] =\n        'getCoalescedEvents' in event ? event.getCoalescedEvents() : [event]\n\n      if (coalescedEvents.length > 0 || mouse) {\n        element?.setPointerCapture(event.pointerId)\n      }\n    } catch (error) {\n      if (debug) {\n        console.warn('Failed to set pointer capture:', error)\n      }\n    }\n  }\n}\n\nexport function guardedReleasePointerCapture(\n  args: GuardedReleasePointerCaptureArgs\n): void {\n  const { event, element } = args\n  if (element?.hasPointerCapture(event.pointerId)) {\n    element.releasePointerCapture(event.pointerId)\n  }\n}\n","export function scrollbarGutterSupport() {\n  return CSS.supports('scrollbar-gutter', 'stable')\n}\n","export function scrollbarWidth() {\n  const wrapper = document.createElement('div')\n  wrapper.style.position = 'absolute'\n  wrapper.style.visibility = 'hidden'\n  wrapper.style.overflow = 'hidden'\n  wrapper.style.width = '100px'\n  wrapper.style.height = '100px'\n  wrapper.style.top = '-9999px'\n\n  wrapper.innerHTML = '<div style=\"width: 200px; height: 200px;\"></div>'\n  document.body.appendChild(wrapper)\n\n  // Get the scrollbar width\n  const withoutScrollbar = wrapper.clientWidth\n  wrapper.style.overflow = 'scroll'\n  const withScrollbar = wrapper.clientWidth\n\n  // Clean up\n  document.body.removeChild(wrapper)\n\n  return Math.round(withoutScrollbar - withScrollbar)\n}\n","export interface SlugifyOptions {\n  separator?: string\n  trim?: boolean\n  remove?: RegExp\n  strict?: boolean\n  lowercase?: boolean\n}\n\nconst defaultOptions: SlugifyOptions = {\n  separator: '-',\n  trim: true,\n  remove: undefined,\n  strict: true,\n  lowercase: true,\n}\n\nexport function slugify(string: string, options?: SlugifyOptions): string {\n  if (typeof string !== 'string') {\n    throw new Error('slugify: string argument expected')\n  }\n\n  // Merge provided options with default options\n  const _options = { ...defaultOptions, ...options }\n\n  const charMap: { [key: string]: string } = {}\n\n  let slug = string\n    .normalize()\n    .split('')\n    .reduce(function (result, ch) {\n      let appendChar = charMap[ch]\n      if (appendChar === undefined) {\n        appendChar = ch\n      }\n      if (appendChar === _options?.separator) {\n        appendChar = ' '\n      }\n      return (\n        result +\n        appendChar.replace(_options?.remove || /[^\\w\\s$*_+~.()'\"!\\-:@]+/g, '')\n      )\n    }, '')\n\n  if (_options.strict) {\n    slug = slug.replace(/[^A-Za-z0-9\\s]/g, '')\n  }\n\n  if (_options.trim) {\n    slug = slug.trim()\n  }\n\n  if (_options.separator) {\n    slug = slug.replace(/ +/g, _options.separator)\n  }\n\n  if (_options.lowercase) {\n    slug = slug.toLocaleLowerCase()\n  }\n\n  return slug\n}\n","export function uniq<T extends unknown[]>(a: T) {\n  return Array.from(new Set(a))\n}\n"],"mappings":"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","names":[]}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maas/vue-equipment",
   "description": "Our Frontend Toolkit, Free and Open Source",
-  "version": "1.0.0-beta.57",
+  "version": "1.0.0-beta.58",
   "contributors": [
     {
       "name": "Robin Scholz",
@@ -13,16 +13,20 @@
     }
   ],
   "devDependencies": {
-    "@maas/config": "^1.10.1",
+    "@maas/config": "^1.13.0",
     "@maas/mirror": "catalog:",
     "@release-it/bumper": "^7.0.5",
     "@types/node": "catalog:",
+    "@vitejs/plugin-vue": "^6.0.5",
+    "@vitest/browser-playwright": "^4.1.2",
     "eslint": "^9.39.1",
     "prettier": "catalog:",
     "prettier-plugin-tailwindcss": "^0.7.1",
     "release-it": "^19.0.5",
     "turbo": "^2.6.0",
-    "typescript": "catalog:"
+    "typescript": "catalog:",
+    "vitest": "^4.1.2",
+    "vitest-browser-vue": "^2.1.0"
   },
   "exports": {
     "./nuxt": {
@@ -134,7 +138,7 @@
     "build:docs": "turbo run build --filter=docs",
     "preview:docs": "turbo run preview --filter=docs",
     "update:metadata": "turbo run update --filter=metadata",
-    "test": "echo \"Error: no test specified\" && exit 1",
+    "test": "turbo run test",
     "lint": "turbo run lint",
     "uninstall": "pnpm dlx rimraf --glob ./**/node_modules --glob ./**/pnpm-lock.yaml",
     "release": "turbo run t:release && release-it",