@v-c/menu 0.0.1

package/dist/SubMenu/PopupTrigger.js

@@ -0,0 +1,168 @@
+import { defineComponent, shallowRef, computed, watch, createVNode } from "vue";
+import Trigger from "@v-c/trigger";
+import { clsx } from "@v-c/util";
+import raf from "@v-c/util/dist/raf.ts";
+import { useMenuContext } from "../context/MenuContext.js";
+import { placementsRtl, placements } from "../placements.js";
+import { getMotion } from "../utils/motionUtil.js";
+const popupPlacementMap = {
+  "horizontal": "bottomLeft",
+  "vertical": "rightTop",
+  "vertical-left": "rightTop",
+  "vertical-right": "leftTop"
+};
+const PopupTrigger = /* @__PURE__ */ defineComponent((props, {
+  slots
+}) => {
+  const menuContext = useMenuContext();
+  const innerVisible = shallowRef(props.visible ?? false);
+  const placement = computed(() => {
+    const rtl = menuContext?.value?.rtl;
+    const builtinPlacements = menuContext?.value?.builtinPlacements;
+    return rtl ? {
+      ...placementsRtl,
+      ...builtinPlacements
+    } : {
+      ...placements,
+      ...builtinPlacements
+    };
+  });
+  const triggerMode = computed(() => props.mode);
+  const popupPlacement = computed(() => {
+    return popupPlacementMap[triggerMode.value];
+  });
+  const defaultMotions = computed(() => menuContext?.value?.defaultMotions);
+  const motion = computed(() => menuContext?.value?.motion);
+  const targetMotion = computed(() => {
+    return {
+      ...getMotion(triggerMode.value, motion.value, defaultMotions.value)
+    };
+  });
+  const targetMotionRef = shallowRef(targetMotion.value);
+  watch(triggerMode, (mode) => {
+    if (mode !== "inline") {
+      targetMotionRef.value = targetMotion.value;
+    }
+  }, {
+    immediate: true
+  });
+  watch([motion, defaultMotions], () => {
+    if (triggerMode.value !== "inline") {
+      targetMotionRef.value = targetMotion.value;
+    }
+  });
+  const mergedMotion = computed(() => {
+    return {
+      ...targetMotionRef.value,
+      appear: true
+    };
+  });
+  const visibleRef = shallowRef();
+  watch(() => props.visible, (visible, _, onCleanup) => {
+    visibleRef.value = raf(() => {
+      innerVisible.value = visible;
+    });
+    onCleanup(() => {
+      if (visibleRef.value !== void 0) {
+        raf.cancel(visibleRef.value);
+      }
+    });
+  });
+  return () => {
+    const {
+      popupClassName,
+      popup,
+      popupStyle,
+      popupOffset,
+      disabled,
+      onVisibleChange,
+      prefixCls
+    } = props;
+    const {
+      rtl,
+      rootClassName,
+      mode,
+      getPopupContainer,
+      triggerSubMenuAction,
+      subMenuCloseDelay,
+      subMenuOpenDelay,
+      forceSubMenuRender
+    } = menuContext?.value ?? {};
+    return createVNode(Trigger, {
+      "prefixCls": prefixCls,
+      "popupClassName": clsx(`${prefixCls}-popup`, {
+        [`${prefixCls}-rtl`]: rtl
+      }, popupClassName, rootClassName),
+      "stretch": mode === "horizontal" ? "minWidth" : void 0,
+      "getPopupContainer": getPopupContainer,
+      "builtinPlacements": placement.value,
+      "popupPlacement": popupPlacement.value,
+      "popupVisible": innerVisible.value,
+      "popup": popup,
+      "popupStyle": popupStyle,
+      "popupAlign": popupOffset && {
+        offset: popupOffset
+      },
+      "action": disabled ? [] : [triggerSubMenuAction],
+      "mouseEnterDelay": subMenuOpenDelay,
+      "mouseLeaveDelay": subMenuCloseDelay,
+      "onOpenChange": onVisibleChange,
+      "forceRender": forceSubMenuRender,
+      "popupMotion": mergedMotion.value,
+      "fresh": true
+    }, {
+      default: () => [slots?.default?.()]
+    });
+  };
+}, {
+  props: {
+    prefixCls: {
+      type: String,
+      required: true,
+      default: void 0
+    },
+    mode: {
+      type: String,
+      required: true,
+      default: void 0
+    },
+    visible: {
+      type: Boolean,
+      required: true,
+      default: void 0
+    },
+    popup: {
+      type: null,
+      required: true,
+      default: void 0
+    },
+    popupStyle: {
+      type: null,
+      required: false,
+      default: void 0
+    },
+    popupClassName: {
+      type: String,
+      required: false,
+      default: void 0
+    },
+    popupOffset: {
+      type: Array,
+      required: false,
+      default: void 0
+    },
+    disabled: {
+      type: Boolean,
+      required: true,
+      default: void 0
+    },
+    onVisibleChange: {
+      type: Function,
+      required: true,
+      default: void 0
+    }
+  }
+});
+export {
+  PopupTrigger as default
+};

package/dist/SubMenu/SubMenuList.cjs

@@ -0,0 +1,28 @@
+"use strict";
+Object.defineProperties(exports, { __esModule: { value: true }, [Symbol.toStringTag]: { value: "Module" } });
+const vue = require("vue");
+const util = require("@v-c/util");
+const MenuContext = require("../context/MenuContext.cjs");
+const InternalSubMenuList = /* @__PURE__ */ vue.defineComponent((_, {
+  attrs,
+  slots
+}) => {
+  const menuContext = MenuContext.useMenuContext();
+  return () => {
+    const {
+      prefixCls,
+      mode,
+      rtl
+    } = menuContext?.value ?? {};
+    return vue.createVNode("ul", vue.mergeProps({
+      "class": util.clsx(prefixCls, !!rtl && `${prefixCls}-rtl`, `${prefixCls}-sub`, `${prefixCls}-${mode === "inline" ? "inline" : "vertical"}`),
+      "role": "menu"
+    }, attrs, {
+      "data-menu-list": true
+    }), [slots?.default?.()]);
+  };
+}, {
+  name: "InlineSubMenuList",
+  inheritAttrs: false
+});
+exports.default = InternalSubMenuList;

package/dist/SubMenu/SubMenuList.d.ts

@@ -0,0 +1,2 @@
+declare const InternalSubMenuList: import('vue').DefineSetupFnComponent<Record<string, any>, {}, {}, Record<string, any> & {}, import('vue').PublicProps>;
+export default InternalSubMenuList;

package/dist/SubMenu/SubMenuList.js

@@ -0,0 +1,28 @@
+import { defineComponent, createVNode, mergeProps } from "vue";
+import { clsx } from "@v-c/util";
+import { useMenuContext } from "../context/MenuContext.js";
+const InternalSubMenuList = /* @__PURE__ */ defineComponent((_, {
+  attrs,
+  slots
+}) => {
+  const menuContext = useMenuContext();
+  return () => {
+    const {
+      prefixCls,
+      mode,
+      rtl
+    } = menuContext?.value ?? {};
+    return createVNode("ul", mergeProps({
+      "class": clsx(prefixCls, !!rtl && `${prefixCls}-rtl`, `${prefixCls}-sub`, `${prefixCls}-${mode === "inline" ? "inline" : "vertical"}`),
+      "role": "menu"
+    }, attrs, {
+      "data-menu-list": true
+    }), [slots?.default?.()]);
+  };
+}, {
+  name: "InlineSubMenuList",
+  inheritAttrs: false
+});
+export {
+  InternalSubMenuList as default
+};