@maas/vue-equipment 1.0.0-beta.41 → 1.0.0-beta.43

package/dist/composables/useScrollLockPadding/index.d.ts

@@ -0,0 +1,9 @@
+type UseScrollLockPaddingArgs = {
+    exclude: RegExp;
+};
+declare function useScrollLockPadding(args?: UseScrollLockPaddingArgs): {
+    add: () => void;
+    remove: () => void;
+};
+
+export { type UseScrollLockPaddingArgs, useScrollLockPadding };

package/dist/composables/useScrollLockPadding/index.js

@@ -0,0 +1,56 @@
+// useScrollLockPadding/index.ts
+import { ref } from "vue";
+import {
+  matchClass,
+  scrollbarGutterSupport,
+  scrollbarWidth
+} from "@maas/vue-equipment/utils";
+function useScrollLockPadding(args) {
+  const exclude = args?.exclude || "";
+  const positionFixedElements = ref([]);
+  function add() {
+    if (typeof window === "undefined") {
+      return;
+    }
+    const excludeRegEx = new RegExp(exclude);
+    document.body.style.setProperty(
+      "--scrollbar-width",
+      `${scrollbarWidth()}px`
+    );
+    positionFixedElements.value = [
+      ...document.body.getElementsByTagName("*")
+    ].filter(
+      (x) => getComputedStyle(x, null).getPropertyValue("position") === "fixed" && getComputedStyle(x, null).getPropertyValue("right") === "0px" && !matchClass(x, excludeRegEx)
+    );
+    switch (scrollbarGutterSupport()) {
+      case true:
+        document.documentElement.style.scrollbarGutter = "stable";
+        positionFixedElements.value.forEach((elem) => {
+          elem.style.scrollbarGutter = "stable";
+          elem.style.overflow = "auto";
+        });
+        break;
+      case false:
+        document.body.style.paddingRight = "var(--scrollbar-width)";
+        positionFixedElements.value.forEach(
+          (elem) => elem.style.paddingRight = "var(--scrollbar-width)"
+        );
+        break;
+    }
+  }
+  function remove() {
+    document.documentElement.style.scrollbarGutter = "";
+    document.body.style.removeProperty("--scrollbar-width");
+    document.body.style.paddingRight = "";
+    positionFixedElements.value.forEach((elem) => {
+      elem.style.paddingRight = "";
+      elem.style.scrollbarGutter = "";
+      elem.style.overflow = "";
+    });
+  }
+  return { add, remove };
+}
+export {
+  useScrollLockPadding
+};
+//# sourceMappingURL=index.js.map

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

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../packages/composables/useScrollLockPadding/index.ts"],"sourcesContent":["import { ref } from 'vue'\nimport {\n  matchClass,\n  scrollbarGutterSupport,\n  scrollbarWidth,\n} from '@maas/vue-equipment/utils'\n\nexport type UseScrollLockPaddingArgs = {\n  exclude: RegExp\n}\n\nexport function useScrollLockPadding(args?: UseScrollLockPaddingArgs) {\n  const exclude = args?.exclude || ''\n  const positionFixedElements = ref<HTMLElement[]>([])\n\n  function add() {\n    if (typeof window === 'undefined') {\n      return\n    }\n\n    const excludeRegEx = new RegExp(exclude)\n\n    document.body.style.setProperty(\n      '--scrollbar-width',\n      `${scrollbarWidth()}px`\n    )\n\n    positionFixedElements.value = [\n      ...document.body.getElementsByTagName('*'),\n    ].filter(\n      (x) =>\n        getComputedStyle(x, null).getPropertyValue('position') === 'fixed' &&\n        getComputedStyle(x, null).getPropertyValue('right') === '0px' &&\n        !matchClass(x, excludeRegEx)\n    ) as HTMLElement[]\n\n    switch (scrollbarGutterSupport()) {\n      case true:\n        document.documentElement.style.scrollbarGutter = 'stable'\n        positionFixedElements.value.forEach((elem) => {\n          elem.style.scrollbarGutter = 'stable'\n          elem.style.overflow = 'auto'\n        })\n        break\n      case false:\n        document.body.style.paddingRight = 'var(--scrollbar-width)'\n        positionFixedElements.value.forEach(\n          (elem) => (elem.style.paddingRight = 'var(--scrollbar-width)')\n        )\n        break\n    }\n  }\n\n  function remove() {\n    document.documentElement.style.scrollbarGutter = ''\n    document.body.style.removeProperty('--scrollbar-width')\n    document.body.style.paddingRight = ''\n    positionFixedElements.value.forEach((elem) => {\n      elem.style.paddingRight = ''\n      elem.style.scrollbarGutter = ''\n      elem.style.overflow = ''\n    })\n  }\n\n  return { add, remove }\n}\n"],"mappings":";AAAA,SAAS,WAAW;AACpB;AAAA,EACE;AAAA,EACA;AAAA,EACA;AAAA,OACK;AAMA,SAAS,qBAAqB,MAAiC;AACpE,QAAM,UAAU,MAAM,WAAW;AACjC,QAAM,wBAAwB,IAAmB,CAAC,CAAC;AAEnD,WAAS,MAAM;AACb,QAAI,OAAO,WAAW,aAAa;AACjC;AAAA,IACF;AAEA,UAAM,eAAe,IAAI,OAAO,OAAO;AAEvC,aAAS,KAAK,MAAM;AAAA,MAClB;AAAA,MACA,GAAG,eAAe,CAAC;AAAA,IACrB;AAEA,0BAAsB,QAAQ;AAAA,MAC5B,GAAG,SAAS,KAAK,qBAAqB,GAAG;AAAA,IAC3C,EAAE;AAAA,MACA,CAAC,MACC,iBAAiB,GAAG,IAAI,EAAE,iBAAiB,UAAU,MAAM,WAC3D,iBAAiB,GAAG,IAAI,EAAE,iBAAiB,OAAO,MAAM,SACxD,CAAC,WAAW,GAAG,YAAY;AAAA,IAC/B;AAEA,YAAQ,uBAAuB,GAAG;AAAA,MAChC,KAAK;AACH,iBAAS,gBAAgB,MAAM,kBAAkB;AACjD,8BAAsB,MAAM,QAAQ,CAAC,SAAS;AAC5C,eAAK,MAAM,kBAAkB;AAC7B,eAAK,MAAM,WAAW;AAAA,QACxB,CAAC;AACD;AAAA,MACF,KAAK;AACH,iBAAS,KAAK,MAAM,eAAe;AACnC,8BAAsB,MAAM;AAAA,UAC1B,CAAC,SAAU,KAAK,MAAM,eAAe;AAAA,QACvC;AACA;AAAA,IACJ;AAAA,EACF;AAEA,WAAS,SAAS;AAChB,aAAS,gBAAgB,MAAM,kBAAkB;AACjD,aAAS,KAAK,MAAM,eAAe,mBAAmB;AACtD,aAAS,KAAK,MAAM,eAAe;AACnC,0BAAsB,MAAM,QAAQ,CAAC,SAAS;AAC5C,WAAK,MAAM,eAAe;AAC1B,WAAK,MAAM,kBAAkB;AAC7B,WAAK,MAAM,WAAW;AAAA,IACxB,CAAC;AAAA,EACH;AAEA,SAAO,EAAE,KAAK,OAAO;AACvB;","names":[]}

package/dist/nuxt/module.json

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

package/dist/nuxt/module.mjs

@@ -127,6 +127,13 @@ const functions$1 = [
 		docs: "https://maas.egineering/vue-equipment/composables/useMetaViewport/",
 		description: "Set and reset the meta viewport tag programatically"
 	},
+	{
+		name: "useScrollLockPadding",
+		"package": "composables",
+		lastUpdated: 1763989817000,
+		docs: "https://maas.egineering/vue-equipment/composables/useScrollLockPadding/",
+		description: "A small utility to prevent fixed elements from jumping when locking scroll"
+	},
 	{
 		name: "useScrollTo",
 		"package": "composables",
@@ -141,7 +148,7 @@ functions.map((f) => f.name);
 const plugins = functions.filter((p) => p.package === "plugins");
 const composables = functions.filter((p) => p.package === "composables");
 
-const module = defineNuxtModule({
+const module$1 = defineNuxtModule({
   meta: {
     name: "@maas/vue-equipment/nuxt",
     configKey: "vueEquipment"
@@ -194,4 +201,4 @@ const module = defineNuxtModule({
   }
 });
 
-export { module as default };
+export { module$1 as default };

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

@@ -19,9 +19,9 @@
         @leave="onLeave"
         @after-leave="onAfterLeave"
       >
-        <primitive v-show="view?.active" :as-child="asChild">
+        <vue-primitive v-show="view?.active" :as-child="asChild">
           <slot :view-active="view?.active" />
-        </primitive>
+        </vue-primitive>
       </transition>
     </auto-size>
   </div>
@@ -31,7 +31,7 @@
 import { inject, computed } from "vue";
 import { defu } from "defu";
 import { AutoSize } from "@maas/vue-autosize";
-import { Primitive } from "@maas/vue-primitive";
+import { VuePrimitive } from "@maas/vue-primitive";
 import {
   useMagicError
 } from "@maas/vue-equipment/plugins/MagicError";

package/dist/plugins/MagicAccordion/src/components/MagicAccordionProvider.vue

@@ -1,12 +1,16 @@
 <template>
-  <primitive :data-id="id" :as-child="asChild" class="magic-accordion-provider">
+  <vue-primitive
+    :data-id="id"
+    :as-child="asChild"
+    class="magic-accordion-provider"
+  >
     <slot />
-  </primitive>
+  </vue-primitive>
 </template>
 
 <script setup>
 import { onBeforeUnmount, provide } from "vue";
-import { Primitive } from "@maas/vue-primitive";
+import { VuePrimitive } from "@maas/vue-primitive";
 import { useAccordionState } from "../composables/private/useAccordionState";
 import { MagicAccordionInstanceId } from "../symbols";
 const { id, asChild, options } = defineProps({

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

@@ -1,5 +1,5 @@
 <template>
-  <primitive
+  <vue-primitive
     ref="el"
     :as-child="asChild"
     :data-id="`${mappedViewId}-trigger`"
@@ -10,12 +10,12 @@
     @click="onClick"
   >
     <slot :view-active="view?.active" />
-  </primitive>
+  </vue-primitive>
 </template>
 
 <script setup>
 import { useTemplateRef, inject, computed, toValue } from "vue";
-import { Primitive } from "@maas/vue-primitive";
+import { VuePrimitive } from "@maas/vue-primitive";
 import { onKeyStroke } from "@vueuse/core";
 import {
   useMagicError

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

@@ -1,17 +1,17 @@
 <template>
-  <primitive
+  <vue-primitive
     :as-child="asChild"
     :data-id="mappedId"
     :data-active="mappedActive"
     class="magic-accordion-view"
   >
     <slot :view-active="mappedActive" />
-  </primitive>
+  </vue-primitive>
 </template>
 
 <script setup>
 import { computed, inject, onBeforeUnmount, provide, useId } from "vue";
-import { Primitive } from "@maas/vue-primitive";
+import { VuePrimitive } from "@maas/vue-primitive";
 import {
   useMagicError
 } from "@maas/vue-equipment/plugins/MagicError";

package/dist/plugins/MagicAccordion/src/composables/private/useAccordionTrigger.d.ts

@@ -1,12 +1,12 @@
 import { type ComputedRef, type MaybeRef, type Ref } from 'vue';
-import { Primitive } from '@maas/vue-primitive';
+import { VuePrimitive } from '@maas/vue-primitive';
 import type { Interaction } from '../../types/index.js';
 interface UseAccordionTriggerArgs {
     instanceId: MaybeRef<string>;
     viewId: string;
     trigger: Interaction;
     mappedDisabled: ComputedRef<boolean>;
-    elRef: Ref<InstanceType<typeof Primitive> | null>;
+    elRef: Ref<InstanceType<typeof VuePrimitive> | null>;
 }
 export declare function useAccordionTrigger(args: UseAccordionTriggerArgs): {
     onMouseenter: () => void;

package/dist/plugins/MagicAccordion/src/composables/private/useAccordionTrigger.mjs

@@ -1,5 +1,5 @@
 import {} from "vue";
-import { Primitive } from "@maas/vue-primitive";
+import { VuePrimitive } from "@maas/vue-primitive";
 import { useFocus } from "@vueuse/core";
 import { useAccordionView } from "./useAccordionView.mjs";
 export function useAccordionTrigger(args) {

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

@@ -11,11 +11,11 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<MagicCommandItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    click: (event: MouseEvent) => any;
     enter: () => any;
+    click: (event: MouseEvent) => any;
 }, string, import("vue").PublicProps, Readonly<MagicCommandItemProps> & Readonly<{
-    onClick?: ((event: MouseEvent) => any) | undefined;
     onEnter?: (() => any) | undefined;
+    onClick?: ((event: MouseEvent) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

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

@@ -11,11 +11,11 @@ type __VLS_Slots = {} & {
     default?: (props: typeof __VLS_1) => any;
 };
 declare const __VLS_base: import("vue").DefineComponent<MagicCommandItemProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {} & {
-    click: (event: MouseEvent) => any;
     enter: () => any;
+    click: (event: MouseEvent) => any;
 }, string, import("vue").PublicProps, Readonly<MagicCommandItemProps> & Readonly<{
-    onClick?: ((event: MouseEvent) => any) | undefined;
     onEnter?: (() => any) | undefined;
+    onClick?: ((event: MouseEvent) => any) | undefined;
 }>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

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

@@ -1,13 +1,17 @@
 <template>
-  <primitive :data-id="id" :as-child="asChild" class="magic-command-provider">
+  <vue-primitive
+    :data-id="id"
+    :as-child="asChild"
+    class="magic-command-provider"
+  >
     <slot />
-  </primitive>
+  </vue-primitive>
 </template>
 
 <script setup>
 import { shallowRef, provide, watch, onBeforeUnmount } from "vue";
 import { useMagicKeys, usePointer } from "@vueuse/core";
-import { Primitive } from "@maas/vue-primitive";
+import { VuePrimitive } from "@maas/vue-primitive";
 import { useMagicError } from "@maas/vue-equipment/plugins/MagicError";
 import { createDefu } from "defu";
 import { useCommandState } from "../composables/private/useCommandState";

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

@@ -1,5 +1,5 @@
 <template>
-  <primitive
+  <vue-primitive
     ref="el"
     :data-id="`${mappedViewId}-trigger`"
     :data-active="mappedActive"
@@ -10,12 +10,12 @@
     @mouseenter="onMouseenter"
   >
     <slot :view-active="view?.active" :trigger-disabled="mappedDisabled" />
-  </primitive>
+  </vue-primitive>
 </template>
 
 <script setup>
 import { computed, inject, useTemplateRef, toValue, watch } from "vue";
-import { Primitive } from "@maas/vue-primitive";
+import { VuePrimitive } from "@maas/vue-primitive";
 import {
   useMagicError
 } from "@maas/vue-equipment/plugins/MagicError";

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

@@ -1,5 +1,5 @@
 <template>
-  <div :data-id="mappedId" class="magic-menu-view">
+  <div :data-id="mappedId" class="magic-command-view">
     <slot :view-active="view.active" />
   </div>
 </template>

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

@@ -1,5 +1,5 @@
 import { type ComputedRef, type MaybeRef, type Ref } from 'vue';
-import { Primitive } from '@maas/vue-primitive';
+import { VuePrimitive } from '@maas/vue-primitive';
 import type { Action, Interaction } from '../../types/index.js';
 type UseCommandTriggerArgs = {
     instanceId: MaybeRef<string>;
@@ -8,7 +8,7 @@ type UseCommandTriggerArgs = {
     mappedActive?: ComputedRef<boolean>;
     trigger: Interaction[];
     action: Action;
-    elRef: Ref<InstanceType<typeof Primitive> | null>;
+    elRef: Ref<InstanceType<typeof VuePrimitive> | null>;
 };
 export declare function useCommandTrigger(args: UseCommandTriggerArgs): {
     onMouseenter: () => Promise<void>;

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

@@ -1,5 +1,5 @@
 import { nextTick } from "vue";
-import { Primitive } from "@maas/vue-primitive";
+import { VuePrimitive } from "@maas/vue-primitive";
 import { useFocus } from "@vueuse/core";
 import { useCommandView } from "./useCommandView.mjs";
 import { useCommandState } from "./useCommandState.mjs";

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

@@ -95,12 +95,7 @@ export function useDraggableDrag(args) {
     snapPoints
   });
   const emitter = useMagicEmitter();
-  const {
-    lockScroll,
-    unlockScroll,
-    addScrollLockPadding,
-    removeScrollLockPadding
-  } = useDraggableScrollLock();
+  const { lockScroll, unlockScroll } = useDraggableScrollLock();
   function getSizes() {
     elRect.value = unrefElement(elRef)?.getBoundingClientRect();
     wrapperRect.value = unrefElement(wrapperRef)?.getBoundingClientRect();
@@ -283,10 +278,9 @@ export function useDraggableDrag(args) {
     resetStateAndListeners();
     const scrollLockValue = toValue(scrollLock);
     if (scrollLockValue) {
-      unlockScroll();
-      if (typeof scrollLockValue === "object" && scrollLockValue.padding) {
-        removeScrollLockPadding();
-      }
+      unlockScroll(
+        typeof scrollLockValue === "object" && scrollLockValue.padding
+      );
     }
     guardedReleasePointerCapture({ event: e, element: elRef.value });
   }
@@ -324,10 +318,7 @@ export function useDraggableDrag(args) {
     }
     const scrollLockValue = toValue(scrollLock);
     if (scrollLockValue) {
-      if (typeof scrollLockValue === "object" && scrollLockValue.padding) {
-        addScrollLockPadding();
-      }
-      lockScroll();
+      lockScroll(typeof scrollLockValue === "object" && scrollLockValue.padding);
     }
     if (dragging.value) {
       return;

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

@@ -1,6 +1,4 @@
 export declare function useDraggableScrollLock(): {
-    lockScroll: () => void;
-    unlockScroll: () => void;
-    addScrollLockPadding: () => void;
-    removeScrollLockPadding: () => void;
+    lockScroll: (padding?: boolean) => void;
+    unlockScroll: (padding?: boolean) => void;
 };

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

@@ -1,63 +1,23 @@
-import { shallowRef, ref } from "vue";
+import { shallowRef } from "vue";
 import { useScrollLock } from "@vueuse/core";
-import {
-  matchClass,
-  scrollbarWidth,
-  scrollbarGutterSupport
-} from "@maas/vue-equipment/utils";
+import { useScrollLockPadding } from "@maas/vue-equipment/composables/useScrollLockPadding";
 const scrollLock = typeof window !== "undefined" ? useScrollLock(document?.documentElement) : shallowRef(false);
+const { add, remove } = useScrollLockPadding({ exclude: /magic-draggable/ });
 export function useDraggableScrollLock() {
-  const positionFixedElements = ref([]);
-  function lockScroll() {
+  function lockScroll(padding) {
+    if (padding) {
+      add();
+    }
     scrollLock.value = true;
   }
-  function unlockScroll() {
+  function unlockScroll(padding) {
     scrollLock.value = false;
-  }
-  function addScrollLockPadding() {
-    if (typeof window === "undefined") {
-      return;
+    if (padding) {
+      remove();
     }
-    const exclude = new RegExp(/magic-draggable/);
-    document.body.style.setProperty(
-      "--scrollbar-width",
-      `${scrollbarWidth()}px`
-    );
-    positionFixedElements.value = [
-      ...document.body.getElementsByTagName("*")
-    ].filter(
-      (x) => getComputedStyle(x, null).getPropertyValue("position") === "fixed" && getComputedStyle(x, null).getPropertyValue("right") === "0px" && !matchClass(x, exclude)
-    );
-    switch (scrollbarGutterSupport()) {
-      case true:
-        document.documentElement.style.scrollbarGutter = "stable";
-        positionFixedElements.value.forEach((elem) => {
-          elem.style.scrollbarGutter = "stable";
-          elem.style.overflow = "auto";
-        });
-        break;
-      case false:
-        document.body.style.paddingRight = "var(--scrollbar-width)";
-        positionFixedElements.value.forEach(
-          (elem) => elem.style.paddingRight = "var(--scrollbar-width)"
-        );
-        break;
-    }
-  }
-  function removeScrollLockPadding() {
-    document.documentElement.style.scrollbarGutter = "";
-    document.body.style.removeProperty("--scrollbar-width");
-    document.body.style.paddingRight = "";
-    positionFixedElements.value.forEach((elem) => {
-      elem.style.paddingRight = "";
-      elem.style.scrollbarGutter = "";
-      elem.style.overflow = "";
-    });
   }
   return {
     lockScroll,
-    unlockScroll,
-    addScrollLockPadding,
-    removeScrollLockPadding
+    unlockScroll
   };
 }

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

@@ -110,14 +110,7 @@ const mappedId = toValue(id);
 const elRef = useTemplateRef("el");
 const drawerRef = useTemplateRef("drawer");
 const wrapperRef = useTemplateRef("wrapper");
-const {
-  trapFocus,
-  releaseFocus,
-  lockScroll,
-  unlockScroll,
-  addScrollLockPadding,
-  removeScrollLockPadding
-} = useDrawerDOM({
+const { trapFocus, releaseFocus, unlockScroll } = useDrawerDOM({
   focusTarget: drawerRef,
   focusTrap: mappedOptions.focusTrap
 });
@@ -177,10 +170,6 @@ const {
 } = useDrawerCallback({
   id,
   mappedOptions,
-  addScrollLockPadding,
-  removeScrollLockPadding,
-  lockScroll,
-  unlockScroll,
   trapFocus,
   releaseFocus,
   wrapperActive,
@@ -283,10 +272,9 @@ onBeforeUnmount(() => {
 });
 onUnmounted(() => {
   if (mappedOptions.scrollLock) {
-    unlockScroll();
-    if (typeof mappedOptions.scrollLock === "object" && mappedOptions.scrollLock.padding) {
-      removeScrollLockPadding();
-    }
+    unlockScroll(
+      typeof mappedOptions.scrollLock === "object" && mappedOptions.scrollLock.padding
+    );
   }
   if (mappedOptions.focusTrap) {
     releaseFocus();

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

@@ -3,10 +3,6 @@ import type { MagicDrawerOptions } from '../../types/index.js';
 type UseDrawerCallbackArgs = {
     id: MaybeRef<string>;
     mappedOptions: MagicDrawerOptions;
-    addScrollLockPadding: () => void;
-    removeScrollLockPadding: () => void;
-    lockScroll: () => void;
-    unlockScroll: () => void;
     trapFocus: () => void;
     releaseFocus: () => void;
     wrapperActive: Ref<boolean>;

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

@@ -1,28 +1,25 @@
 import { toValue, nextTick } from "vue";
 import { useMetaViewport } from "@maas/vue-equipment/composables/useMetaViewport";
 import { useMagicEmitter } from "@maas/vue-equipment/plugins/MagicEmitter";
+import { useDrawerDOM } from "./useDrawerDOM.mjs";
 export function useDrawerCallback(args) {
   const {
     id,
     mappedOptions,
-    addScrollLockPadding,
-    removeScrollLockPadding,
-    lockScroll,
-    unlockScroll,
     trapFocus,
     releaseFocus,
     wrapperActive,
     wasActive
   } = args;
+  const { lockScroll, unlockScroll } = useDrawerDOM();
   const { setMetaViewport, resetMetaViewport } = useMetaViewport();
   const emitter = useMagicEmitter();
   function onBeforeEnter() {
     emitter.emit("beforeEnter", toValue(id));
     if (mappedOptions.scrollLock) {
-      if (typeof mappedOptions.scrollLock === "object" && mappedOptions.scrollLock.padding) {
-        addScrollLockPadding();
-      }
-      lockScroll();
+      lockScroll(
+        typeof mappedOptions.scrollLock === "object" && mappedOptions.scrollLock.padding
+      );
     }
     if (mappedOptions.preventZoom) {
       setMetaViewport();
@@ -48,10 +45,9 @@ export function useDrawerCallback(args) {
   function onAfterLeave() {
     emitter.emit("afterLeave", toValue(id));
     if (mappedOptions.scrollLock) {
-      unlockScroll();
-      if (typeof mappedOptions.scrollLock === "object" && mappedOptions.scrollLock.padding) {
-        removeScrollLockPadding();
-      }
+      unlockScroll(
+        typeof mappedOptions.scrollLock === "object" && mappedOptions.scrollLock.padding
+      );
     }
     if (mappedOptions.focusTrap) {
       releaseFocus();

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

@@ -6,8 +6,6 @@ export type UseDrawerDOMArgs = Pick<MagicDrawerOptions, 'scrollLock' | 'focusTra
 export declare function useDrawerDOM(args?: UseDrawerDOMArgs): {
     trapFocus: () => void;
     releaseFocus: () => void;
-    lockScroll: () => void;
-    unlockScroll: () => void;
-    addScrollLockPadding: () => void;
-    removeScrollLockPadding: () => void;
+    lockScroll: (padding?: boolean) => void;
+    unlockScroll: (padding?: boolean) => void;
 };