@maas/vue-equipment 1.0.0-beta.18 → 1.0.0-beta.19

package/dist/nuxt/module.json

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

package/dist/plugins/MagicAccordion/src/components/MagicAccordionContent.vue.d.ts

@@ -21,7 +21,7 @@ declare const mappedAnimation: import("vue").ComputedRef<{
 declare const onBeforeEnter: () => void, onEnter: () => void, onAfterEnter: () => Promise<void>, onBeforeLeave: () => void, onLeave: () => void, onAfterLeave: () => void;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_13: {
-    viewActive: any;
+    viewActive: boolean | undefined;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_13) => any;

package/dist/plugins/MagicAccordion/src/components/MagicAccordionTrigger.vue.d.ts

@@ -13,7 +13,7 @@ declare const mappedDisabled: import("vue").ComputedRef<boolean | undefined>;
 declare const onMouseenter: () => void, onClick: () => void;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_12: {
-    viewActive: any;
+    viewActive: boolean | undefined;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_12) => any;

package/dist/plugins/MagicAccordion/src/components/MagicAccordionView.vue.d.ts

@@ -8,7 +8,7 @@ declare const mappedId: import("vue").ComputedRef<string>;
 declare const view: import("../types/index.js").AccordionView;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_6: {
-    viewActive: any;
+    viewActive: boolean;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_6) => any;

package/dist/plugins/MagicCommand/src/components/MagicCommandItem.vue.d.ts

@@ -10,7 +10,7 @@ declare function guardedSelect(): void;
 declare function onClick(event: MouseEvent): void;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_1: {
-    itemActive: any;
+    itemActive: boolean;
     itemDisabled: boolean;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {

package/dist/plugins/MagicCommand/src/components/MagicCommandTrigger.vue.d.ts

@@ -15,8 +15,8 @@ declare const mappedDisabled: import("vue").ComputedRef<boolean>;
 declare const onMouseenter: () => Promise<void>, onClick: (e: MouseEvent) => Promise<void>;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_12: {
-    viewActive: any;
-    triggerDisabled: any;
+    viewActive: boolean | undefined;
+    triggerDisabled: boolean;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_12) => any;

package/dist/plugins/MagicCommand/src/components/MagicCommandView.vue.d.ts

@@ -6,7 +6,7 @@ declare const mappedId: import("vue").ComputedRef<string>;
 declare const view: import("../types/index.js").CommandView;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_1: {
-    viewActive: any;
+    viewActive: boolean;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_1) => any;

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

@@ -6,7 +6,7 @@ interface MagicCookieItemProps {
 declare const item: import("../types/index.js").CookieItem;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_1: {
-    item: any;
+    item: import("../types/index.js").CookieItem;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_1) => any;

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

@@ -5,7 +5,7 @@ declare const state: import("../types/index.js").CookieState;
 declare const onBeforeEnter: () => void, onEnter: () => void, onAfterEnter: () => Promise<void>, onBeforeLeave: () => void, onLeave: () => void, onAfterLeave: () => void;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_18: {
-    viewActive: any;
+    viewActive: boolean;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_18) => any;

package/dist/plugins/MagicDraggable/src/components/MagicDraggable.vue.d.ts

@@ -68,10 +68,10 @@ declare const mappedOptions: Omit<MagicDraggableOptions, keyof MagicDraggableOpt
             easing?: (t: number) => number;
         };
     });
+    tag: "div" | "dialog";
     scrollLock: boolean | {
         padding: boolean;
     };
-    tag: "div" | "dialog";
     snapPoints: import("../types/index.js").DraggableSnapPoint[];
     initial: {
         snapPoint?: import("../types/index.js").DraggableSnapPoint;

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

@@ -76,6 +76,9 @@ declare const mappedOptions: Omit<MagicDrawerOptions, keyof MagicDrawerOptions>
             easing?: (t: number) => number;
         };
     });
+    backdrop: boolean;
+    tag: "div" | "dialog";
+    focusTrap: boolean | import("focus-trap").Options;
     scrollLock: {
         padding: boolean;
     } | ((boolean | {
@@ -107,6 +110,10 @@ declare const mappedOptions: Omit<MagicDrawerOptions, keyof MagicDrawerOptions>
     } & true, "padding"> & {
         padding: boolean;
     });
+    teleport: {
+        target?: string;
+        disabled?: boolean;
+    };
     keyListener: ({
         close?: string[] | false;
     } & import("../../../../utils/index.js").RequireAll<{
@@ -120,15 +127,8 @@ declare const mappedOptions: Omit<MagicDrawerOptions, keyof MagicDrawerOptions>
     }>, "close"> & {
         close: (false | string[] | undefined) & (false | string[]);
     });
-    position: "left" | "top" | "right" | "bottom";
-    backdrop: boolean;
-    tag: "div" | "dialog";
-    focusTrap: boolean | import("focus-trap").Options;
+    position: "right" | "left" | "top" | "bottom";
     snapPoints: import("../types/index.js").DrawerSnapPoint[];
-    teleport: {
-        target?: string;
-        disabled?: boolean;
-    };
     initial: {
         open?: boolean;
         transition?: boolean;

package/dist/plugins/MagicMenu/src/components/MagicMenuItem.vue.d.ts

@@ -10,7 +10,7 @@ declare function guardedUnselect(): void;
 declare function onClick(event: MouseEvent): void;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_1: {
-    itemActive: any;
+    itemActive: boolean;
     itemDisabled: boolean;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {

package/dist/plugins/MagicMenu/src/components/MagicMenuRemote.vue.d.ts

@@ -12,7 +12,7 @@ declare const onClick: () => void, onMouseenter: () => void;
 declare let channel: import("../types/index.js").MenuChannel;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_11: {
-    channelActive: any;
+    channelActive: boolean;
     remoteDisabled: boolean;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {

package/dist/plugins/MagicMenu/src/components/MagicMenuTrigger.vue.d.ts

@@ -14,8 +14,8 @@ declare const mappedTabindex: import("vue").ComputedRef<0 | undefined>;
 declare const onMouseenter: () => void, onClick: (e: MouseEvent) => void;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_13: {
-    viewActive: any;
-    triggerDisabled: any;
+    viewActive: boolean | undefined;
+    triggerDisabled: boolean;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_13) => any;

package/dist/plugins/MagicMenu/src/components/MagicMenuView.vue.d.ts

@@ -7,7 +7,7 @@ declare const mappedId: import("vue").ComputedRef<string>;
 declare const view: import("../types/index.js").MenuView;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_1: {
-    viewActive: any;
+    viewActive: boolean;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_1) => any;

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

@@ -12,19 +12,19 @@ declare const mappedOptions: Omit<MagicModalOptions, keyof MagicModalOptions> &
         content?: string;
         backdrop?: string;
     };
-    scrollLock: boolean | {
-        padding: boolean;
-    };
-    keyListener: {
-        close?: string[] | false;
-    };
     backdrop: boolean;
     tag: "div" | "dialog";
     focusTrap: boolean | import("focus-trap").Options;
+    scrollLock: boolean | {
+        padding: boolean;
+    };
     teleport: {
         target?: string;
         disabled?: boolean;
     };
+    keyListener: {
+        close?: string[] | false;
+    };
 };
 declare const mappedId: string;
 declare const close: () => void;

package/dist/plugins/MagicScroll/src/components/MagicScrollProvider.vue.d.ts

@@ -22,7 +22,24 @@ declare const scrollReturn: {
 };
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_1: {
-    scrollReturn: any;
+    scrollReturn: {
+        x: import("vue").WritableComputedRef<number, number>;
+        y: import("vue").WritableComputedRef<number, number>;
+        isScrolling: import("vue").ShallowRef<boolean, boolean>;
+        arrivedState: {
+            left: boolean;
+            right: boolean;
+            top: boolean;
+            bottom: boolean;
+        };
+        directions: {
+            left: boolean;
+            right: boolean;
+            top: boolean;
+            bottom: boolean;
+        };
+        measure(): void;
+    };
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_1) => any;

package/dist/plugins/MagicScroll/src/components/MagicScrollScene.vue.d.ts

@@ -6,7 +6,7 @@ interface MagicScrollSceneProps {
 declare const progress: import("vue").ShallowRef<number, number>;
 declare const __VLS_ctx: InstanceType<__VLS_PickNotAny<typeof __VLS_self, new () => {}>>;
 declare var __VLS_1: {
-    progress: any;
+    progress: number;
 };
 type __VLS_Slots = __VLS_PrettifyGlobal<__VLS_OmitStringIndex<typeof __VLS_ctx.$slots> & {
     default?: (props: typeof __VLS_1) => any;

package/dist/plugins/MagicScroll/src/composables/private/useCollisionDetection.mjs

@@ -1,5 +1,5 @@
 import { shallowRef, reactive, computed, toValue } from "vue";
-import { useElementBounding } from "@vueuse/core";
+import { useElementBounding, useWindowSize } from "@vueuse/core";
 import { useMagicEmitter } from "@maas/vue-equipment/plugins";
 export function useCollisionDetection(args) {
   const { id, scrollY, child, parent, offset } = args;
@@ -25,8 +25,18 @@ export function useCollisionDetection(args) {
       }
     }
   });
+  const { width, height } = useWindowSize();
+  const windowBoundingRect = {
+    width,
+    height,
+    right: width,
+    bottom: height,
+    top: shallowRef(0),
+    left: shallowRef(0)
+  };
   const childBoundingRect = useElementBounding(child);
   const parentBoundingRect = useElementBounding(parent);
+  const mappedParentBoundingRect = toValue(parent) ? parentBoundingRect : windowBoundingRect;
   const mappedOffset = { top: 0, bottom: 0, ...offset };
   const lastScrollY = shallowRef(0);
   const scrollDirection = shallowRef();
@@ -101,7 +111,7 @@ export function useCollisionDetection(args) {
     }
     const offset2 = mappedOffset[parentEdge];
     const mappedChildEdge = toValue(childBoundingRect[childEdge]);
-    const mappedParentEdge = toValue(parentBoundingRect[parentEdge]) + offset2;
+    const mappedParentEdge = toValue(mappedParentBoundingRect[parentEdge]) + offset2;
     if (direction === "down" && mappedChildEdge <= mappedParentEdge || direction === "up" && mappedChildEdge >= mappedParentEdge) {
       alerted[direction][childEdge][parentEdge] = true;
       useMagicEmitter().emit("collision", {
@@ -119,7 +129,7 @@ export function useCollisionDetection(args) {
     }
     const offset2 = mappedOffset[parentEdge];
     const mappedChildEdge = toValue(childBoundingRect[childEdge]);
-    const mappedParentEdge = toValue(parentBoundingRect[parentEdge]) + offset2;
+    const mappedParentEdge = toValue(mappedParentBoundingRect[parentEdge]) + offset2;
     if (direction === "down" && mappedChildEdge >= mappedParentEdge || direction === "up" && mappedChildEdge <= mappedParentEdge) {
       alerted[direction][childEdge][parentEdge] = false;
     }

package/dist/plugins/MagicScroll/src/composables/private/useScrollApi.d.ts

@@ -1,12 +1,12 @@
 import { type MaybeRef, type MaybeRefOrGetter } from 'vue';
 import type { ScrollIntersection } from '../../types/index.js';
-type UseScrollApiParams = {
+type UseScrollApiArgs = {
     child: MaybeRef<HTMLElement | null | undefined>;
     parent: MaybeRefOrGetter<HTMLElement | null | undefined>;
     from: ScrollIntersection;
     to: ScrollIntersection;
 };
-export declare function useScrollApi(params: UseScrollApiParams): {
+export declare function useScrollApi(args: UseScrollApiArgs): {
     getCalculations: () => void;
     getProgress: () => number;
 };

package/dist/plugins/MagicScroll/src/composables/private/useScrollApi.mjs

@@ -1,20 +1,28 @@
 import {
-  ref,
   shallowRef,
   inject,
   toValue
 } from "vue";
-import { useWindowSize } from "@vueuse/core";
-import { MagicScrollReturn } from "../../symbols/index.mjs";
+import { useElementBounding, useWindowSize } from "@vueuse/core";
 import { clampValue } from "@maas/vue-equipment/utils";
-export function useScrollApi(params) {
-  const { child, parent, from, to } = params;
+import { MagicScrollReturn } from "../../symbols/index.mjs";
+export function useScrollApi(args) {
+  const { child, parent, from, to } = args;
   const scrollReturn = inject(MagicScrollReturn, void 0);
-  const childRect = ref(void 0);
-  const parentRect = ref(void 0);
   const start = shallowRef(0);
   const end = shallowRef(0);
-  const { width: windowWidth, height: windowHeight } = useWindowSize();
+  const { width, height } = useWindowSize();
+  const windowBoundingRect = {
+    width,
+    height,
+    right: width,
+    bottom: height,
+    top: shallowRef(0),
+    left: shallowRef(0)
+  };
+  const childBoundingRect = useElementBounding(child);
+  const parentBoundingRect = useElementBounding(parent);
+  const mappedParentBoundingRect = toValue(parent) ? parentBoundingRect : windowBoundingRect;
   function splitLocation(location) {
     return {
       child: location.match(/^[a-z]+/)[0],
@@ -23,55 +31,52 @@ export function useScrollApi(params) {
   }
   function getOffsetTop(points) {
     let y = 0;
-    if (!childRect.value) return y;
     const scrollY = toValue(scrollReturn?.y) || 0;
+    const parentTop = mappedParentBoundingRect.top.value;
+    const parentHeight = mappedParentBoundingRect.height.value;
+    const childTop = childBoundingRect.top.value;
+    const childHeight = childBoundingRect.height.value;
+    if (!childHeight) {
+      return y;
+    }
     switch (points.child) {
       case "top":
-        y += childRect.value.top + scrollY;
+        y += childTop + scrollY;
         break;
       case "center":
-        y += childRect.value.top + childRect.value.height / 2 + scrollY;
+        y += childTop + childHeight / 2 + scrollY;
         break;
       case "bottom":
-        y += childRect.value.top + childRect.value.height + scrollY;
+        y += childTop + childHeight + scrollY;
         break;
     }
-    if (!parentRect.value) {
+    if (!mappedParentBoundingRect.height.value) {
       return y;
     }
-    const dimensions = {
-      width: toValue(parentRect.value.width),
-      height: toValue(parentRect.value.height),
-      top: toValue(parentRect.value.top)
-    };
     switch (points.parent) {
       case "top":
-        y -= dimensions.top;
+        y -= parentTop;
         break;
       case "center":
-        y -= dimensions.top + dimensions.height / 2;
+        y -= parentTop + parentHeight / 2;
         break;
       case "bottom":
-        y -= dimensions.top + dimensions.height;
+        y -= parentTop + parentHeight;
         break;
       case "initial":
-        y -= childRect.value.top + scrollY;
+        y -= childTop + scrollY;
         break;
     }
     return y;
   }
   function getCalculations() {
-    childRect.value = toValue(child)?.getBoundingClientRect();
-    parentRect.value = toValue(parent) ? toValue(parent)?.getBoundingClientRect() : {
-      width: windowWidth.value,
-      height: windowHeight.value,
-      top: 0
-    };
+    childBoundingRect.update();
+    parentBoundingRect.update();
     start.value = getOffsetTop(splitLocation(from));
     end.value = getOffsetTop(splitLocation(to));
   }
   function getProgress() {
-    const scrollY = toValue(scrollReturn?.y) || 0;
+    const scrollY = toValue(scrollReturn?.y) ?? 0;
     const total = Math.abs(end.value - start.value);
     const current = scrollY - start.value;
     return clampValue(current / total, 0, 1);

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@maas/vue-equipment",
   "description": "Our Frontend Toolkit, Free and Open Source",
-  "version": "1.0.0-beta.18",
+  "version": "1.0.0-beta.19",
   "contributors": [
     {
       "name": "Robin Scholz",