@maas/vue-equipment 0.34.0 → 0.35.1

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

@@ -3,22 +3,18 @@ interface MagicCommandProps {
     options?: MagicCommandModalOptions;
 }
 declare function __VLS_template(): {
-    default?(_: {}): any;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    attrs: Partial<{}>;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_TypePropsToOption<MagicCommandProps>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_TypePropsToOption<MagicCommandProps>>>, {}, {}>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue").DefineComponent<MagicCommandProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MagicCommandProps> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToOption<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};

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

@@ -5,36 +5,20 @@ interface MagicCommandProps {
     options?: MagicCommandOptions;
 }
 declare function __VLS_template(): {
-    default?(_: {}): any;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {};
+    attrs: Partial<{}>;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicCommandProps>, {
-    options: () => MagicCommandOptions;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicCommandProps>, {
-    options: () => MagicCommandOptions;
-}>>>, {
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue").DefineComponent<MagicCommandProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MagicCommandProps> & Readonly<{}>, {
     options: MagicCommandOptions;
-}, {}>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
-type __VLS_WithDefaults<P, D> = {
-    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
-        default: D[K];
-    }> : P[K];
-};
-type __VLS_Prettify<T> = {
-    [K in keyof T]: T[K];
-} & {};
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToOption<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};

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

@@ -14,8 +14,8 @@ import {
   onUnmounted,
   watch,
   nextTick,
+  useId,
 } from 'vue'
-import { uuid } from '@maas/vue-equipment/utils'
 import { useCommandStore } from '../composables/private/useCommandStore'
 import { useCommandView } from '../composables/private/useCommandView'
 import { MagicCommandInstanceId } from '../symbols'
@@ -34,7 +34,7 @@ const elRef = ref<HTMLElement | undefined>(undefined)
 const { activeView, selectView } = useCommandView()
 
 const mappedId = computed(() => {
-  return props.id ?? uuid()
+  return props.id ?? useId() ?? ''
 })
 
 const isActive = computed(() => {

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

@@ -3,36 +3,22 @@ interface MagicCommandViewProps {
     default?: boolean;
 }
 declare function __VLS_template(): {
-    default?(_: {}): any;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        elRef: HTMLDivElement;
+    };
+    attrs: Partial<{}>;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicCommandViewProps>, {
-    default: boolean;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicCommandViewProps>, {
-    default: boolean;
-}>>>, {
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue").DefineComponent<MagicCommandViewProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MagicCommandViewProps> & Readonly<{}>, {
     default: boolean;
-}, {}>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
-type __VLS_WithDefaults<P, D> = {
-    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
-        default: D[K];
-    }> : P[K];
-};
-type __VLS_Prettify<T> = {
-    [K in keyof T]: T[K];
-} & {};
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToOption<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};

package/dist/plugins/MagicCommand/src/composables/private/useCommandItem.d.ts

@@ -4,6 +4,6 @@ export declare function useCommandItem(id: MaybeRef<string>): {
     prevItem: (loop?: boolean) => void;
     selectItem: (id: string) => void;
     selectLastItem: () => void;
-    activeItem: import("vue").Ref<string | undefined>;
-    lastActiveItem: import("vue").Ref<string | undefined>;
+    activeItem: import("vue").Ref<string | undefined, string | undefined>;
+    lastActiveItem: import("vue").Ref<string | undefined, string | undefined>;
 };

package/dist/plugins/MagicCommand/src/composables/private/useCommandStore.d.ts

@@ -15,6 +15,13 @@ export declare function useCommandStore(): {
             id: string;
         }[];
         views: string[];
+    }[], CommandInstance[] | {
+        id: string;
+        items: {
+            index: number;
+            id: string;
+        }[];
+        views: string[];
     }[]>;
     addInstance: (id: string) => void;
     findInstance: (id: string) => CommandInstance;

package/dist/plugins/MagicCommand/src/composables/private/useCommandView.d.ts

@@ -1,6 +1,6 @@
 export declare function useCommandView(): {
     selectView: (id: string) => void;
     selectLastView: () => void;
-    activeView: import("vue").Ref<string | undefined>;
-    lastActiveView: import("vue").Ref<string | undefined>;
+    activeView: import("vue").Ref<string | undefined, string | undefined>;
+    lastActiveView: import("vue").Ref<string | undefined, string | undefined>;
 };

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

@@ -1,5 +1,5 @@
 import type { InjectionKey, MaybeRef } from 'vue';
-import type { MagicCommandOptions } from '../types.js';
+import type { MagicCommandOptions } from '../types/index.js';
 declare const MagicCommandInstanceId: InjectionKey<MaybeRef<string>>;
 declare const MagicCommandProviderOptions: InjectionKey<MagicCommandOptions>;
 export { MagicCommandInstanceId, MagicCommandProviderOptions };

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

@@ -1,5 +1,5 @@
-import type { MagicModalOptions } from '../../../MagicModal.js';
-import type { MagicDrawerOptions } from '../../../MagicDrawer.js';
+import type { MagicModalOptions } from '../../../MagicModal/index.js';
+import type { MagicDrawerOptions } from '../../../MagicDrawer/index.js';
 export type MagicCommandOptions = {
     keys?: {
         open?: string[] | false;

package/dist/plugins/MagicCommand/src/utils/defaultOptions.d.ts

@@ -1,4 +1,4 @@
-import type { MagicCommandOptions } from '../types.js';
+import type { MagicCommandOptions } from '../types/index.js';
 import type { RequireAllNested } from '@maas/vue-equipment/utils';
 declare const defaultOptions: RequireAllNested<MagicCommandOptions>;
 type DefaultOptions = typeof defaultOptions;

package/dist/plugins/MagicCookie/nuxt.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("@nuxt/schema").NuxtModule<import("@nuxt/schema").ModuleOptions>;
+declare const _default: import("@nuxt/schema").NuxtModule<import("@nuxt/schema").ModuleOptions, import("@nuxt/schema").ModuleOptions, false>;
 export default _default;

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

@@ -3,40 +3,24 @@ type MagicCookieProps = {
     cookies: MagicCookieRecord[];
     maxAge?: number;
 };
-declare function __VLS_template(): Partial<Record<string, (_: {
-    cookie: MagicCookieRecord;
-}) => any>> & {
-    default?(_: {}): any;
-    actions?(_: {}): any;
+declare function __VLS_template(): {
+    slots: Partial<Record<string, (_: {
+        cookie: MagicCookieRecord;
+    }) => any>> & {
+        default?(_: {}): any;
+        actions?(_: {}): any;
+    };
+    refs: {};
+    attrs: Partial<{}>;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicCookieProps>, {
-    maxAge: number;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicCookieProps>, {
-    maxAge: number;
-}>>>, {
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue").DefineComponent<MagicCookieProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MagicCookieProps> & Readonly<{}>, {
     maxAge: number;
-}, {}>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
-type __VLS_WithDefaults<P, D> = {
-    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
-        default: D[K];
-    }> : P[K];
-};
-type __VLS_Prettify<T> = {
-    [K in keyof T]: T[K];
-} & {};
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToOption<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};

package/dist/plugins/MagicCookie/src/composables/private/useCookieApi.d.ts

@@ -1,4 +1,4 @@
-import type { MagicCookieRecord } from '../../types.js';
+import type { MagicCookieRecord } from '../../types/index.js';
 type UseCookieApiArgs = {
     cookies: MagicCookieRecord[];
     maxAge?: number;
@@ -7,9 +7,21 @@ export declare const cookieApiStore: import("vue").Ref<{
     cookies: {
         [x: string]: unknown;
         key: string;
-        optional?: boolean;
-        title?: string;
-        text?: string;
+        optional?: boolean | undefined;
+        title?: string | undefined;
+        text?: string | undefined;
+    }[];
+    maxAge: number | undefined;
+}, {
+    cookies: MagicCookieRecord[];
+    maxAge: number | undefined;
+} | {
+    cookies: {
+        [x: string]: unknown;
+        key: string;
+        optional?: boolean | undefined;
+        title?: string | undefined;
+        text?: string | undefined;
     }[];
     maxAge: number | undefined;
 }>;

package/dist/plugins/MagicCookie/src/composables/useMagicCookie.d.ts

@@ -1,10 +1,12 @@
-import type { MagicCookieConsent } from '../types.js';
+import type { MagicCookieConsent } from '../types/index.js';
 export declare function useMagicCookie(): {
-    preferencesVisible: import("vue").Ref<boolean>;
+    preferencesVisible: import("vue").Ref<boolean, boolean>;
     selectedCookies: import("vue").Ref<{
         [key: string]: boolean;
+    }, {
+        [key: string]: boolean;
     }>;
-    cookieConsent: import("vue").WritableComputedRef<MagicCookieConsent>;
+    cookieConsent: import("vue").WritableComputedRef<MagicCookieConsent, MagicCookieConsent>;
     toggleSelection: (key: string) => void;
     accept: () => void;
     acceptSelected: () => void;

package/dist/plugins/MagicDraggable/index.d.ts

@@ -1,6 +1,6 @@
 import type { Plugin } from 'vue';
 import MagicDraggable from './src/components/MagicDraggable.vue.js';
-import type { MagicDraggableOptions } from './src/types.js';
+import type { MagicDraggableOptions } from './src/types/index.js';
 declare const MagicDraggablePlugin: Plugin;
 export { MagicDraggablePlugin, MagicDraggable };
 export type { MagicDraggableOptions };

package/dist/plugins/MagicDraggable/nuxt.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("@nuxt/schema").NuxtModule<import("@nuxt/schema").ModuleOptions>;
+declare const _default: import("@nuxt/schema").NuxtModule<import("@nuxt/schema").ModuleOptions, import("@nuxt/schema").ModuleOptions, false>;
 export default _default;

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

@@ -6,36 +6,24 @@ interface MagicDraggableProps {
     options?: MagicDraggableOptions;
 }
 declare function __VLS_template(): {
-    default?(_: {}): any;
+    slots: {
+        default?(_: {}): any;
+    };
+    refs: {
+        drawerRef: HTMLDivElement;
+        wrapperRef: HTMLDivElement;
+        elRef: unknown;
+    };
+    attrs: Partial<{}>;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicDraggableProps>, {
-    options: () => any;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicDraggableProps>, {
-    options: () => any;
-}>>>, {
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue").DefineComponent<MagicDraggableProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MagicDraggableProps> & Readonly<{}>, {
     options: MagicDraggableOptions;
-}, {}>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
-type __VLS_WithDefaults<P, D> = {
-    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
-        default: D[K];
-    }> : P[K];
-};
-type __VLS_Prettify<T> = {
-    [K in keyof T]: T[K];
-} & {};
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToOption<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};

package/dist/plugins/MagicDraggable/src/composables/private/useDraggableDrag.mjs

@@ -12,7 +12,12 @@ import {
   useThrottleFn,
   useIdle
 } from "@vueuse/core";
-import { isIOS, isWithinRange } from "@maas/vue-equipment/utils";
+import {
+  guardedReleasePointerCapture,
+  guardedSetPointerCapture,
+  isIOS,
+  isWithinRange
+} from "@maas/vue-equipment/utils";
 import { useMagicEmitter } from "@maas/vue-equipment/plugins";
 import { useDraggableSnap } from "./useDraggableSnap.mjs";
 import { useDraggableState } from "./useDraggableState.mjs";
@@ -227,7 +232,7 @@ export function useDraggableDrag(args) {
     });
     return closestSnapPoint;
   }
-  function onPointerup(_e) {
+  function onPointerup(e) {
     if (!momentumThresholdReached.value && distanceThresholdReached.value) {
       interpolateTo.value = findClosestSnapPoint();
     }
@@ -255,6 +260,7 @@ export function useDraggableDrag(args) {
     resetStateAndListeners();
     unlockScroll();
     removeScrollLockPadding();
+    guardedReleasePointerCapture({ event: e, element: elRef.value });
   }
   function onPointermove(e) {
     if (!e.isPrimary) {
@@ -297,6 +303,7 @@ export function useDraggableDrag(args) {
     if (dragging.value) {
       return;
     } else {
+      guardedSetPointerCapture({ event: e, element: elRef.value });
       dragging.value = true;
       emitter.emit("beforeDrag", {
         id: toValue(id),
@@ -309,7 +316,12 @@ export function useDraggableDrag(args) {
     lastDraggedX.value = draggedX.value;
     lastDraggedY.value = draggedY.value;
     cancelPointerup = useEventListener(document, "pointerup", onPointerup);
-    cancelPointermove = useEventListener(document, "pointermove", onPointermove);
+    cancelPointermove = useEventListener(
+      document,
+      "pointermove",
+      onPointermove,
+      { passive: false }
+    );
     cancelTouchend = isIOS() ? useEventListener(document, "touchend", onPointerup) : void 0;
     originX.value = e.screenX - draggedX.value;
     originY.value = e.screenY - draggedY.value;

package/dist/plugins/MagicDraggable/src/composables/private/useDraggableSnap.d.ts

@@ -1,6 +1,6 @@
 import { type MaybeRef, type Ref } from 'vue';
 import { type DefaultOptions } from '../../utils/defaultOptions.js';
-import type { DraggableSnapPoint, Coordinates } from '../../types.js';
+import type { DraggableSnapPoint, Coordinates } from '../../types/index.js';
 type UseDraggableSnapArgs = {
     id: MaybeRef<string>;
     elRect: Ref<DOMRect | undefined>;
@@ -24,8 +24,14 @@ type SnapToArgs = {
 export declare function useDraggableSnap(args: UseDraggableSnapArgs): {
     mappedSnapPoints: import("@vueuse/core").ComputedRefWithControl<Coordinates[]>;
     activeSnapPoint: Ref<("center" | "top-left" | "top-center" | "top-right" | "center-left" | "center-right" | "bottom-left" | "bottom-center" | "bottom-right") | ["center" | "top-left" | "top-center" | "top-right" | "center-left" | "center-right" | "bottom-left" | "bottom-center" | "bottom-right", offset?: {
+        x?: number | undefined;
+        y?: number | undefined;
+    } | undefined] | undefined, "center" | "top-left" | "top-center" | "top-right" | "center-left" | "center-right" | "bottom-left" | "bottom-center" | "bottom-right" | ["center" | "top-left" | "top-center" | "top-right" | "center-left" | "center-right" | "bottom-left" | "bottom-center" | "bottom-right", offset?: {
         x?: number;
         y?: number;
+    } | undefined] | ["center" | "top-left" | "top-center" | "top-right" | "center-left" | "center-right" | "bottom-left" | "bottom-center" | "bottom-right", offset?: {
+        x?: number | undefined;
+        y?: number | undefined;
     } | undefined] | undefined>;
     snapPointsMap: import("@vueuse/core").ComputedRefWithControl<Record<string, DraggableSnapPoint>>;
     mapSnapPoint: (snapPoint: DraggableSnapPoint) => Coordinates | undefined;

package/dist/plugins/MagicDraggable/src/utils/defaultOptions.d.ts

@@ -1,4 +1,4 @@
-import type { MagicDraggableOptions } from '../types.js';
+import type { MagicDraggableOptions } from '../types/index.js';
 import type { RequireAll } from '@maas/vue-equipment/utils';
 type DefaultOptions = RequireAll<MagicDraggableOptions> & {
     threshold: RequireAll<MagicDraggableOptions['threshold']>;

package/dist/plugins/MagicDrawer/nuxt.d.ts

@@ -1,2 +1,2 @@
-declare const _default: import("@nuxt/schema").NuxtModule<import("@nuxt/schema").ModuleOptions>;
+declare const _default: import("@nuxt/schema").NuxtModule<import("@nuxt/schema").ModuleOptions, import("@nuxt/schema").ModuleOptions, false>;
 export default _default;

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

@@ -90,6 +90,7 @@ import { useDrawerProgress } from '../composables/private/useDrawerProgress'
 import { useDrawerDrag } from '../composables/private/useDrawerDrag'
 import { useDrawerWheel } from '../composables/private/useDrawerWheel'
 import { useDrawerState } from '../composables/private/useDrawerState'
+import { useMagicDrawer } from '../composables/useMagicDrawer'
 
 import type { MagicDrawerOptions } from '../types/index'
 
@@ -103,7 +104,6 @@ import '@maas/vue-equipment/utils/css/animations/slide-ltr-out.css'
 import '@maas/vue-equipment/utils/css/animations/slide-rtl-out.css'
 import '@maas/vue-equipment/utils/css/animations/slide-ttb-out.css'
 import '@maas/vue-equipment/utils/css/animations/slide-btt-out.css'
-import { useMagicDrawer } from '../composables/useMagicDrawer'
 
 defineOptions({
   inheritAttrs: false,
@@ -309,7 +309,12 @@ function guardedClose() {
 
 function saveOvershoot() {
   const element = unrefElement(drawerRef)
-  const overshootVar = getComputedStyle(element!).getPropertyValue(
+
+  if (!element) {
+    return
+  }
+
+  const overshootVar = getComputedStyle(element, null).getPropertyValue(
     '--magic-drawer-drag-overshoot'
   )
   overshoot.value = convertToPixels(overshootVar) || 0

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

@@ -16,37 +16,25 @@ interface MagicDrawerProps {
     options?: MagicDrawerOptions;
 }
 declare function __VLS_template(): {
-    backdrop?(_: {}): any;
-    default?(_: {}): any;
+    slots: {
+        backdrop?(_: {}): any;
+        default?(_: {}): any;
+    };
+    refs: {
+        drawerRef: HTMLDivElement;
+        wrapperRef: HTMLDivElement;
+        elRef: unknown;
+    };
+    attrs: Partial<{}>;
 };
-declare const __VLS_component: import("vue").DefineComponent<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicDrawerProps>, {
-    options: () => any;
-}>, {}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<__VLS_WithDefaults<__VLS_TypePropsToOption<MagicDrawerProps>, {
-    options: () => any;
-}>>>, {
+type __VLS_TemplateResult = ReturnType<typeof __VLS_template>;
+declare const __VLS_component: import("vue").DefineComponent<MagicDrawerProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<MagicDrawerProps> & Readonly<{}>, {
     options: MagicDrawerOptions;
-}, {}>;
-declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, ReturnType<typeof __VLS_template>>;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithTemplateSlots<typeof __VLS_component, __VLS_TemplateResult["slots"]>;
 export default _default;
-type __VLS_WithDefaults<P, D> = {
-    [K in keyof Pick<P, keyof P>]: K extends keyof D ? __VLS_Prettify<P[K] & {
-        default: D[K];
-    }> : P[K];
-};
-type __VLS_Prettify<T> = {
-    [K in keyof T]: T[K];
-} & {};
 type __VLS_WithTemplateSlots<T, S> = T & {
     new (): {
         $slots: S;
     };
 };
-type __VLS_NonUndefinedable<T> = T extends undefined ? never : T;
-type __VLS_TypePropsToOption<T> = {
-    [K in keyof T]-?: {} extends Pick<T, K> ? {
-        type: import('vue').PropType<__VLS_NonUndefinedable<T[K]>>;
-    } : {
-        type: import('vue').PropType<T[K]>;
-        required: true;
-    };
-};

package/dist/plugins/MagicDrawer/src/composables/private/useDrawerCallback.d.ts

@@ -1,5 +1,5 @@
 import { type Ref, type MaybeRef } from 'vue';
-import type { MagicDrawerOptions } from '../../types.js';
+import type { MagicDrawerOptions } from '../../types/index.js';
 type UseDrawerCallbackArgs = {
     id: MaybeRef<string>;
     mappedOptions: MagicDrawerOptions;

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

@@ -13,7 +13,12 @@ import {
   useThrottleFn,
   useScrollLock
 } from "@vueuse/core";
-import { isIOS, isWithinRange } from "@maas/vue-equipment/utils";
+import {
+  guardedReleasePointerCapture,
+  guardedSetPointerCapture,
+  isIOS,
+  isWithinRange
+} from "@maas/vue-equipment/utils";
 import {
   useMagicEmitter
 } from "@maas/vue-equipment/plugins";
@@ -344,14 +349,19 @@ export function useDrawerDrag(args) {
     if (hasDragged.value) {
       e.preventDefault();
     }
+    guardedReleasePointerCapture({ event: e, element: elRef.value });
   }
   function onPointermove(e) {
+    console.log("onPointermove", e);
     if (e.isTrusted && wheeling.value) {
       return;
     }
     if (e.isTrusted && !e.isPrimary) {
       return;
     }
+    e.stopImmediatePropagation();
+    e.stopPropagation();
+    e.preventDefault();
     shouldClose.value = false;
     checkDirection({ x: e.screenX, y: e.screenY });
     if (!scrollLock) {
@@ -377,6 +387,7 @@ export function useDrawerDrag(args) {
     if (dragging.value) {
       return;
     } else {
+      guardedSetPointerCapture({ event: e, element: elRef.value });
       dragging.value = true;
       emitter.emit("beforeDrag", {
         id: toValue(id),
@@ -387,7 +398,12 @@ export function useDrawerDrag(args) {
     lastDraggedX.value = draggedX.value;
     lastDraggedY.value = draggedY.value;
     cancelPointerup = useEventListener(document, "pointerup", onPointerup);
-    cancelPointermove = useEventListener(document, "pointermove", onPointermove);
+    cancelPointermove = useEventListener(
+      document,
+      "pointermove",
+      onPointermove,
+      { passive: false }
+    );
     cancelTouchend = isIOS() ? useEventListener(document, "touchend", onPointerup) : void 0;
     originX.value = e.screenX - draggedX.value;
     originY.value = e.screenY - draggedY.value;

package/dist/plugins/MagicDrawer/src/composables/private/useDrawerGuards.d.ts

@@ -1,6 +1,6 @@
 import { type Ref, type MaybeRef } from 'vue';
 import { type DefaultOptions } from '../../utils/defaultOptions.js';
-import { type DrawerSnapPoint } from '../../types.js';
+import { type DrawerSnapPoint } from '../../types/index.js';
 interface UseDrawerGuardsArgs {
     elRef: Ref<HTMLElement | undefined>;
     absDirectionX: MaybeRef<'with' | 'against' | undefined>;

package/dist/plugins/MagicDrawer/src/composables/private/useDrawerProgress.d.ts

@@ -11,6 +11,9 @@ export declare function useDrawerProgress(args: UseDrawerProgressArgs): {
     progress: Ref<{
         x: number;
         y: number;
+    }, {
+        x: number;
+        y: number;
     }>;
 };
 export {};