@maas/vue-equipment 0.40.0 → 1.0.0-beta.2

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

@@ -1,19 +1,27 @@
 import { reactive, computed, toValue } from "vue";
 import { useMenuState } from "./useMenuState.mjs";
+function isAbortError(error) {
+  return error instanceof DOMException && error.name === "AbortError";
+}
 export function useMenuView(instanceId) {
   const { initializeState } = useMenuState(instanceId);
   const state = initializeState();
-  const currentView = computed(
-    () => state.views.filter((view) => view.active).reduce(
+  const currentInstanceId = toValue(instanceId);
+  const currentView = computed(() => {
+    const activeViews = state.views.filter((view) => view.active);
+    if (activeViews.length === 0) return void 0;
+    if (activeViews.length === 1) return activeViews[0];
+    return activeViews.reduce(
       (a, b) => a.parent.views.length >= b.parent.views.length ? a : b
-    )
-  );
+    );
+  });
+  const viewMap = /* @__PURE__ */ new Map();
   function createView(args) {
     const { id, parent, placement } = args;
     if (parent.views.length === 0) {
-      parent.views.push(toValue(instanceId));
+      parent.views.push(currentInstanceId);
     }
-    const view = {
+    const view = reactive({
       id,
       parent,
       active: false,
@@ -24,124 +32,140 @@ export function useMenuView(instanceId) {
         selectAbortController: new AbortController(),
         unselectAbortController: new AbortController()
       }
-    };
-    return reactive(view);
+    });
+    viewMap.set(id, view);
+    return view;
   }
   function addView(args) {
     const view = createView(args);
-    state.views = [...state.views, view];
+    state.views.push(view);
     return view;
   }
   function delay(ms, signal) {
     return new Promise((resolve, reject) => {
       const timer = setTimeout(resolve, ms);
-      signal.addEventListener("abort", () => {
+      const abortHandler = () => {
         clearTimeout(timer);
         reject(new DOMException("Aborted", "AbortError"));
-      });
+      };
+      signal.addEventListener("abort", abortHandler, { once: true });
     });
   }
-  function initializeView(args) {
-    const { id } = args;
-    let instance = getView(id);
-    if (!instance) instance = addView(args);
-    return instance;
+  function getView(id) {
+    let view = viewMap.get(id);
+    if (!view) {
+      view = state.views.find((v) => v.id === id);
+      if (view) viewMap.set(id, view);
+    }
+    return view;
   }
   function deleteView(id) {
-    state.views = state.views?.filter((view) => view.id !== id);
-  }
-  function getView(id) {
-    return state.views?.find((view) => view.id === id);
+    const index = state.views.findIndex((view) => view.id === id);
+    if (index !== -1) {
+      state.views.splice(index, 1);
+      viewMap.delete(id);
+    }
   }
   function getRelativeViewIndex(id) {
     const view = getView(id);
-    const nestingLevel = view?.parent.views.length;
-    return state.views?.filter((view2) => view2.parent.views.length === nestingLevel).findIndex((view2) => view2.id === id);
+    if (!view) return -1;
+    const nestingLevel = view.parent.views.length;
+    return state.views.findIndex(
+      (v) => v.parent.views.length === nestingLevel && v.id === id
+    );
   }
   function getNextView(id) {
-    const index = state.views?.findIndex((view) => view.id === id);
-    return state.views?.[index + 1];
+    const index = state.views.findIndex((view) => view.id === id);
+    return index !== -1 ? state.views[index + 1] : void 0;
   }
   function getPreviousView(id) {
-    const index = state.views?.findIndex((view) => view.id === id);
-    return state.views?.[index - 1];
+    const index = state.views.findIndex((view) => view.id === id);
+    return index > 0 ? state.views[index - 1] : void 0;
   }
   function getTopLevelView() {
-    return state.views?.find((view) => view.active && !view.parent.item);
+    return state.views.find((view) => view.active && !view.parent.item);
   }
   function getNestedView(itemId) {
-    return state.views?.find((view) => view.parent.item === itemId);
+    return state.views.find((view) => view.parent.item === itemId);
   }
   function getParentView(id) {
     const view = getView(id);
-    const parentId = view?.parent.views[view.parent.views.length - 1];
-    return getView(parentId ?? "");
+    if (!view) return void 0;
+    const parentId = view.parent.views[view.parent.views.length - 1];
+    return parentId ? getView(parentId) : void 0;
   }
   function getUnrelatedViews(id) {
-    const argView = getView(id);
-    return state.views?.filter(
-      (view) => !view.parent.views.includes(id) && !argView?.parent.views.includes(view.id) && view.id !== id
-    );
+    const view = getView(id);
+    if (!view) return [];
+    const parentViewsSet = new Set(view.parent.views);
+    return state.views.filter((v) => v.id !== id && !parentViewsSet.has(v.id));
   }
   function getDescendingViews(id) {
-    const argView = getView(id);
-    return state.views?.filter(
-      (view) => view.id !== id && !argView?.parent.views.includes(view.id)
-    );
+    const view = getView(id);
+    if (!view) return [];
+    const parentViewsSet = new Set(view.parent.views);
+    return state.views.filter((v) => v.id !== id && !parentViewsSet.has(v.id));
   }
   async function selectView(id, delayMs = 0) {
-    const instance = getView(id);
-    if (instance) {
-      if (instance.state.unselectAbortController) {
-        instance.state.unselectAbortController.abort();
-      }
-      const abortController = new AbortController();
-      instance.state.selectAbortController = abortController;
-      try {
+    const view = getView(id);
+    if (!view) return;
+    if (view.state.unselectAbortController) {
+      view.state.unselectAbortController.abort();
+    }
+    const abortController = new AbortController();
+    view.state.selectAbortController = abortController;
+    try {
+      if (delayMs > 0) {
         await delay(delayMs, abortController.signal);
-        instance.active = true;
-        unselectUnrelatedViews(id);
-      } catch (error) {
-        if (error.name === "AbortError" && state.options.debug) {
-          console.log(
-            `selectView() was interrupted by a call to unselectView()`
-          );
-        }
+      }
+      view.active = true;
+      unselectUnrelatedViews(id);
+    } catch (error) {
+      if (isAbortError(error) && state.options.debug) {
+        console.log("selectView() was interrupted by a call to unselectView()");
       }
     }
   }
   async function unselectView(id, delayMs = 0) {
-    const instance = getView(id);
-    if (instance) {
-      if (instance.state.selectAbortController) {
-        instance.state.selectAbortController.abort();
-      }
-      const abortController = new AbortController();
-      instance.state.unselectAbortController = abortController;
-      try {
+    const view = getView(id);
+    if (!view) return;
+    if (view.state.selectAbortController) {
+      view.state.selectAbortController.abort();
+    }
+    const abortController = new AbortController();
+    view.state.unselectAbortController = abortController;
+    try {
+      if (delayMs > 0) {
         await delay(delayMs, abortController.signal);
-        instance.active = false;
-      } catch (error) {
-        if (error.name === "AbortError" && state.options.debug) {
-          console.log(
-            `unselectView() was interrupted by a call to selectView()`
-          );
-        }
+      }
+      view.active = false;
+    } catch (error) {
+      if (isAbortError(error) && state.options.debug) {
+        console.log("unselectView() was interrupted by a call to selectView()");
       }
     }
   }
   function unselectUnrelatedViews(id) {
-    const unrelatedViews = getUnrelatedViews(id);
-    unrelatedViews.forEach((view) => view.active = false);
+    const views = getUnrelatedViews(id);
+    for (const view of views) {
+      view.active = false;
+    }
   }
   function unselectDescendingViews(id) {
-    const descendingViews = getDescendingViews(id);
-    descendingViews.forEach((view) => view.active = false);
+    const views = getDescendingViews(id);
+    for (const view of views) {
+      view.active = false;
+    }
   }
   function unselectAllViews() {
-    state.views?.forEach((view) => {
+    for (const view of state.views) {
       view.active = false;
-    });
+    }
+  }
+  function initializeView(args) {
+    const { id } = args;
+    const view = getView(id) ?? addView(args);
+    return view;
   }
   return {
     currentView,

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

@@ -2,10 +2,10 @@ import type { InjectionKey, MaybeRef } from 'vue';
 declare const MagicMenuInstanceId: InjectionKey<MaybeRef<string>>;
 declare const MagicMenuParentTree: InjectionKey<string[]>;
 declare const MagicMenuViewId: InjectionKey<string>;
-declare const MagicMenuViewActive: InjectionKey<boolean>;
+declare const MagicMenuViewActive: InjectionKey<MaybeRef<boolean>>;
 declare const MagicMenuContentId: InjectionKey<string>;
 declare const MagicMenuItemId: InjectionKey<string>;
-declare const MagicMenuItemActive: InjectionKey<boolean>;
+declare const MagicMenuItemActive: InjectionKey<MaybeRef<boolean>>;
 declare const MagicMenuChannelId: InjectionKey<string>;
-declare const MagicMenuChannelActive: InjectionKey<boolean>;
+declare const MagicMenuChannelActive: InjectionKey<MaybeRef<boolean>>;
 export { MagicMenuInstanceId, MagicMenuParentTree, MagicMenuViewId, MagicMenuViewActive, MagicMenuContentId, MagicMenuItemId, MagicMenuItemActive, MagicMenuChannelId, MagicMenuChannelActive, };

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

@@ -34,8 +34,7 @@ export interface RequiredMagicMenuOptions {
         channel: string;
     };
 }
-export interface OptionalMagicMenuOptions extends Pick<MagicMenuOptions, 'scrollLock' | 'floating' | 'delay'> {
-}
+export type OptionalMagicMenuOptions = Pick<MagicMenuOptions, 'scrollLock' | 'floating' | 'delay'>;
 export type CombinedMagicMenuOptions = RequiredMagicMenuOptions & OptionalMagicMenuOptions;
 export type Interaction = 'click' | 'mouseenter' | 'right-click';
 export type Coordinates = {