ninemoon-ui 0.1.20 → 0.2.1

package/dist/js/menu/menu.js

@@ -54,7 +54,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           ref_key: "menuListRef",
           ref: menuListRef
         }, [
-          (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.menulist, (item, i) => {
+          (openBlock(true), createElementBlock(Fragment, null, renderList(__props.menulist, (item, i) => {
             return openBlock(), createElementBlock("label", { key: item }, [
               withDirectives(createElementVNode("input", {
                 class: "hidden",

package/dist/js/numberInput/numberinput.js

@@ -7,9 +7,9 @@ const _hoisted_1$2 = {
   xmlns: "http://www.w3.org/2000/svg"
 };
 function _sfc_render$1(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$2, _cache[0] || (_cache[0] = [
+  return openBlock(), createElementBlock("svg", _hoisted_1$2, [..._cache[0] || (_cache[0] = [
     createElementVNode("path", { d: "M853.333333 544H170.666667c-17.066667 0-32-14.933333-32-32s14.933333-32 32-32h682.666666c17.066667 0 32 14.933333 32 32s-14.933333 32-32 32z" }, null, -1)
-  ]));
+  ])]);
 }
 const minusIcon = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$1]]);
 const _sfc_main$1 = {};
@@ -19,12 +19,12 @@ const _hoisted_1$1 = {
   xmlns: "http://www.w3.org/2000/svg"
 };
 function _sfc_render(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$1, _cache[0] || (_cache[0] = [
+  return openBlock(), createElementBlock("svg", _hoisted_1$1, [..._cache[0] || (_cache[0] = [
     createElementVNode("path", { d: "M853.333333 480H544V170.666667c0-17.066667-14.933333-32-32-32s-32 14.933333-32 32v309.333333H170.666667c-17.066667 0-32 14.933333-32 32s14.933333 32 32 32h309.333333V853.333333c0 17.066667 14.933333 32 32 32s32-14.933333 32-32V544H853.333333c17.066667 0 32-14.933333 32-32s-14.933333-32-32-32z" }, null, -1)
-  ]));
+  ])]);
 }
 const addIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render]]);
-const _hoisted_1 = { class: "inline-flex w-full rounded-sm border border-solid" };
+const _hoisted_1 = { class: "inline-flex w-full rounded border border-solid" };
 const _hoisted_2 = ["disabled"];
 const _hoisted_3 = ["disabled"];
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -92,12 +92,12 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           type: "button",
           disabled: isMinReached.value,
           onClick: reduceHandle,
-          class: normalizeClass(["disabled:cursor-not-allowed flex-none bg-gray-200 text-xs", sizeClass.value])
+          class: normalizeClass(["disabled:cursor-not-allowed bg-gray-200 text-xs", sizeClass.value])
         }, [
           createVNode(minusIcon, { class: "h-4 w-4 fill-word6 inline-block" })
         ], 10, _hoisted_2),
         withDirectives(createElementVNode("input", {
-          class: "w-full px-1 text-center outline-none text-word3",
+          class: "w-full flex-1 px-1 text-sm text-center outline-none text-word3",
           "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => inputValue.value = $event),
           type: "text"
         }, null, 512), [
@@ -107,7 +107,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           type: "button",
           disabled: isMaxReached.value,
           onClick: addHandle,
-          class: normalizeClass(["disabled:cursor-not-allowed flex-none bg-gray-200 text-xs", sizeClass.value])
+          class: normalizeClass(["disabled:cursor-not-allowed bg-gray-200 text-xs", sizeClass.value])
         }, [
           createVNode(addIcon, { class: "h-4 w-4 fill-word6 inline-block" })
         ], 10, _hoisted_3)

package/dist/js/pagination/pagination.js

@@ -9,7 +9,7 @@ const _hoisted_1$1 = {
   xmlns: "http://www.w3.org/2000/svg"
 };
 function _sfc_render(_ctx, _cache) {
-  return openBlock(), createElementBlock("svg", _hoisted_1$1, _cache[0] || (_cache[0] = [
+  return openBlock(), createElementBlock("svg", _hoisted_1$1, [..._cache[0] || (_cache[0] = [
     createElementVNode("path", {
       d: "M192 512m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z",
       fill: "currentColor"
@@ -22,7 +22,7 @@ function _sfc_render(_ctx, _cache) {
       d: "M832 512m-64 0a64 64 0 1 0 128 0 64 64 0 1 0-128 0Z",
       fill: "currentColor"
     }, null, -1)
-  ]));
+  ])]);
 }
 const ellipsisIcon = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render]]);
 const _hoisted_1 = { class: "flex items-center w-full h-7 text-sm text-center select-none" };
@@ -49,8 +49,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
   emits: [
     "size-change",
     "current-change",
-    "update:currentPage",
-    "update:activeSize"
+    "update:current-page",
+    "update:active-size"
   ],
   setup(__props, { emit: __emit }) {
     const LibSelect = defineAsyncComponent(() => import("../select/select.js"));
@@ -65,7 +65,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const emit = __emit;
     const size = computed({
       set(num) {
-        emit("update:activeSize", num);
+        emit("update:active-size", num);
         emit("size-change", num);
       },
       get() {
@@ -74,7 +74,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     });
     const currentPage = computed({
       set(num) {
-        emit("update:currentPage", num);
+        emit("update:current-page", num);
         emit("current-change", num);
       },
       get() {
@@ -109,10 +109,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return currentPage.value >= maxPage.value;
     });
     const showFirst = computed(() => {
-      return currentPage.value - 5 > 0 && maxPage.value > 7;
+      return currentPage.value - props.visibleRange > 2 && maxPage.value > props.edgeVisibleCount;
     });
     const showLast = computed(() => {
-      return maxPage.value - currentPage.value > 4 && maxPage.value > 7;
+      return maxPage.value - currentPage.value > props.visibleRange && maxPage.value > props.edgeVisibleCount;
     });
     const activeChange = (num) => {
       currentPage.value += num;
@@ -121,6 +121,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       currentPage.value = k;
     };
     const range = (start, end) => {
+      if (start > end) {
+        return [];
+      }
       const length = end - start + 1;
       return Array.from({ length }, (_, i) => start + i);
     };
@@ -133,7 +136,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
             size: "mini"
           }, {
             default: withCtx(() => [
-              (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.sizeArr, (i) => {
+              (openBlock(true), createElementBlock(Fragment, null, renderList(__props.sizeArr, (i) => {
                 return openBlock(), createBlock(unref(LibSelectOption), {
                   value: i,
                   label: `${i}条/页`
@@ -154,7 +157,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         createElementVNode("button", {
           onClick: _cache[1] || (_cache[1] = ($event) => activeChange(-1)),
           type: "button",
-          class: normalizeClass(["w-5 h-5", { "cursor-not-allowed": firstBtnDisable.value }]),
+          class: normalizeClass(["w-5 h-5 flex items-center justify-center", { "cursor-not-allowed": firstBtnDisable.value }]),
           disabled: firstBtnDisable.value
         }, [
           createVNode(ArrowPlug, { class: "h-4 w-4" })
@@ -162,7 +165,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         createElementVNode("ul", _hoisted_5, [
           createElementVNode("li", {
             onClick: _cache[2] || (_cache[2] = ($event) => indexHandle(1)),
-            class: normalizeClass(["px-2 h-5 leading-5 cursor-pointer font-bold", { "text-blue-500": 1 === currentPage.value }])
+            class: normalizeClass(["px-2 h-5 leading-5 cursor-pointer font-bold rounded", { "text-blue-500 bg-blue-100": 1 === currentPage.value }])
           }, " 1 ", 2),
           showFirst.value ? (openBlock(), createBlock(ellipsisIcon, {
             key: 0,
@@ -171,7 +174,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           (openBlock(true), createElementBlock(Fragment, null, renderList(numberArr.value, (i) => {
             return openBlock(), createElementBlock("li", {
               onClick: ($event) => indexHandle(i),
-              class: normalizeClass([{ "text-blue-500": i === currentPage.value }, "px-2 h-5 leading-5 cursor-pointer font-bold"]),
+              class: normalizeClass([{ "text-blue-500 bg-blue-100": i === currentPage.value }, "px-2 h-5 leading-5 cursor-pointer font-bold rounded"]),
               key: i
             }, toDisplayString(i), 11, _hoisted_6);
           }), 128)),
@@ -182,13 +185,13 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
           maxPage.value > 1 ? (openBlock(), createElementBlock("li", {
             key: 2,
             onClick: _cache[3] || (_cache[3] = ($event) => indexHandle(maxPage.value)),
-            class: normalizeClass(["px-2 h-5 leading-5 cursor-pointer font-bold", { "text-blue-500": maxPage.value === currentPage.value }])
+            class: normalizeClass(["px-2 h-5 leading-5 cursor-pointer font-bold rounded", { "text-blue-500 bg-blue-100": maxPage.value === currentPage.value }])
           }, toDisplayString(maxPage.value), 3)) : createCommentVNode("", true)
         ]),
         createElementVNode("button", {
           onClick: _cache[4] || (_cache[4] = ($event) => activeChange(1)),
           type: "button",
-          class: normalizeClass(["w-5 h-5", { "cursor-not-allowed": lastBtnDisable.value }]),
+          class: normalizeClass(["w-5 h-5 flex items-center justify-center", { "cursor-not-allowed": lastBtnDisable.value }]),
           disabled: lastBtnDisable.value
         }, [
           createVNode(ArrowPlug, { class: "h-4 w-4 rotate-180 transform" })

package/dist/js/popover/popover.js

@@ -1,242 +1,6 @@
-import { defineComponent, h, normalizeClass, normalizeStyle, ref, computed, nextTick, getCurrentInstance, openBlock, createElementBlock, withModifiers, renderSlot, createBlock, Teleport, unref, createVNode, Transition, withCtx, withDirectives, createCommentVNode, vShow } from "vue";
-import { u as usePotion, h as createScrollDirective, i as createBgClickDirective, c as createEscapeDirective, s as selector } from "../index/index.js";
-const PLACEMENT_GROUPS = {
-  top: ["topleft", "topmiddle", "topright"],
-  bottom: ["bottomleft", "bottommiddle", "bottomright"],
-  center: ["centerleft", "centerright"]
-};
-const ARROW_CLASSES = {
-  base: 'absolute w-2.5 h-2.5 before:z-[-1] before:border before:border-gray-300 before:bg-white before:content-border before:rotate-45 before:content-[" "] before:w-2.5 before:h-2.5 before:absolute',
-  top: {
-    normal: "before:border-t-transparent before:border-l-transparent before:rounded-br",
-    exchange: "before:border-b-transparent before:border-r-transparent before:rounded-tl"
-  },
-  bottom: {
-    normal: "before:border-b-transparent before:border-r-transparent before:rounded-tl",
-    exchange: "before:border-t-transparent before:border-l-transparent before:rounded-br"
-  },
-  center: {
-    right: "before:border-r-transparent before:border-t-transparent before:rounded-bl",
-    left: "before:border-l-transparent before:border-b-transparent before:rounded-tr"
-  }
-};
-const arrowComponent = defineComponent({
-  name: "PopArrow",
-  props: {
-    arrowLeft: { type: Number, required: true },
-    arrowTop: { type: Number, required: true },
-    placement: { type: String, required: true },
-    exChange: { type: Boolean, required: true },
-    beforebgcolor: { type: String }
-  },
-  setup(props) {
-    const getArrowStyles = () => {
-      const { placement, exChange, arrowLeft, arrowTop } = props;
-      const isTopGroup = PLACEMENT_GROUPS.top.includes(placement);
-      const isBottomGroup = PLACEMENT_GROUPS.bottom.includes(placement);
-      const isCenterGroup = PLACEMENT_GROUPS.center.includes(placement);
-      return {
-        left: isTopGroup || isBottomGroup ? `${arrowLeft}px` : placement === "centerright" ? "-5px" : null,
-        right: placement === "centerleft" ? "-5px" : null,
-        top: isCenterGroup ? `${arrowTop}px` : isBottomGroup && !exChange || isTopGroup && exChange ? "-5px" : null,
-        bottom: isTopGroup && !exChange || isBottomGroup && exChange ? "-5px" : null
-      };
-    };
-    const getArrowClasses = () => {
-      const { placement, exChange, beforebgcolor } = props;
-      const classes = [ARROW_CLASSES.base, beforebgcolor];
-      if (PLACEMENT_GROUPS.top.includes(placement)) {
-        classes.push(exChange ? ARROW_CLASSES.top.exchange : ARROW_CLASSES.top.normal);
-      }
-      if (PLACEMENT_GROUPS.bottom.includes(placement)) {
-        classes.push(exChange ? ARROW_CLASSES.bottom.exchange : ARROW_CLASSES.bottom.normal);
-      }
-      if (placement === "centerright") {
-        classes.push(ARROW_CLASSES.center.right);
-      }
-      if (placement === "centerleft") {
-        classes.push(ARROW_CLASSES.center.left);
-      }
-      return classes;
-    };
-    return () => h("span", {
-      class: normalizeClass(getArrowClasses()),
-      style: normalizeStyle(getArrowStyles())
-    });
-  }
-});
-const defaultWidth = "200px";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "popover",
-  props: {
-    trigger: { default: "click" },
-    width: {},
-    placement: { default: "topleft" },
-    insertClass: {},
-    beforeHidden: {},
-    modelValue: { type: Boolean },
-    beforebgcolor: {},
-    arrowshow: { type: Boolean, default: true }
-  },
-  emits: ["update:modelValue"],
-  setup(__props, { expose: __expose, emit: __emit }) {
-    const props = __props;
-    const base = ref();
-    const pop = ref();
-    const isLocalOpen = ref(false);
-    const shouldShow = computed(() => {
-      if (isLocalOpen.value || props.trigger === "native" && props.modelValue) {
-        nextTick(setPosition);
-      }
-      if (props.trigger === "native") {
-        return props.modelValue;
-      } else {
-        return isLocalOpen.value;
-      }
-    });
-    const emitAct = __emit;
-    const marginClass = computed(() => {
-      const marginMap = {
-        topleft: "-mt-3",
-        topmiddle: "-mt-3",
-        topright: "-mt-3",
-        bottomleft: "mt-3",
-        bottommiddle: "mt-3",
-        bottomright: "mt-3",
-        centerleft: "-ml-3",
-        centerright: "ml-3"
-      };
-      return marginMap[props.placement];
-    });
-    const showHandle = () => {
-      isLocalOpen.value = true;
-    };
-    const hovershowHandle = () => {
-      if (props.trigger === "hover") {
-        isLocalOpen.value = true;
-      }
-    };
-    const Left = ref(0);
-    const Top = ref(0);
-    const arrowLeft = ref(0);
-    const arrowTop = ref(0);
-    const exChange = ref(false);
-    const setPosition = () => {
-      const { top, bottom } = base.value.getBoundingClientRect();
-      if (top < 0 || bottom > window.innerHeight) {
-        hideHandle();
-        return;
-      }
-      const position = usePotion(base.value, pop.value, {
-        position: props.placement
-      });
-      Top.value = position.Top;
-      Left.value = position.Left;
-      arrowTop.value = position.arrowTop;
-      arrowLeft.value = position.arrowLeft;
-      exChange.value = position.exChange;
-    };
-    const { proxy } = getCurrentInstance();
-    const vScroll = createScrollDirective({
-      onMove: () => {
-        setPosition();
-      },
-      scrollContainerId: (proxy == null ? void 0 : proxy.gloablScrollBar) ? proxy == null ? void 0 : proxy.gloablScrollBar : void 0
-    });
-    const vClickoutside = createBgClickDirective({
-      onCheckOut: (event, el) => {
-        if (el.contains(event.target)) {
-          return;
-        } else if (base.value.contains(event.target)) {
-          return;
-        } else {
-          closeCenter();
-        }
-      },
-      moveModel: props.trigger === "hover"
-    });
-    const vEsc = createEscapeDirective({
-      onEscape: () => {
-        hideHandle();
-      }
-    });
-    const closeCenter = () => {
-      if (props.beforeHidden) {
-        props.beforeHidden(hideHandle);
-      } else {
-        hideHandle();
-      }
-    };
-    const hideHandle = (disablecancelflag) => {
-      if (disablecancelflag === true) {
-        return;
-      } else {
-        if (props.trigger === "native") {
-          emitAct("update:modelValue", false);
-        } else {
-          isLocalOpen.value = false;
-        }
-      }
-    };
-    const widthNum = computed(() => {
-      if (!props.width)
-        return defaultWidth;
-      if (typeof props.width === "number") {
-        return `${props.width}px`;
-      } else if (typeof props.width === "string") {
-        const validUnit = /^(?:\d+(?:\.\d+)?)(?:px|%|em|rem|vw|vh)$/.test(
-          props.width
-        );
-        return validUnit ? props.width : `${props.width}px`;
-      }
-      return defaultWidth;
-    });
-    __expose({
-      hideHandle
-    });
-    return (_ctx, _cache) => {
-      return openBlock(), createElementBlock("div", {
-        class: "inline-block",
-        ref_key: "base",
-        ref: base,
-        onClick: showHandle,
-        onMouseenter: withModifiers(hovershowHandle, ["prevent"])
-      }, [
-        renderSlot(_ctx.$slots, "reference"),
-        (openBlock(), createBlock(Teleport, {
-          to: `#${unref(selector)}`
-        }, [
-          createVNode(Transition, { name: "opecity" }, {
-            default: withCtx(() => [
-              withDirectives((openBlock(), createElementBlock("div", {
-                ref_key: "pop",
-                ref: pop,
-                class: normalizeClass(["absolute z-1000 rounded bg-white p-4 drop-shadow border border-gray-300 box-border", [marginClass.value, _ctx.insertClass]]),
-                style: normalizeStyle({ width: widthNum.value, top: `${Top.value}px`, left: `${Left.value}px` })
-              }, [
-                renderSlot(_ctx.$slots, "default"),
-                _ctx.arrowshow ? (openBlock(), createBlock(unref(arrowComponent), {
-                  key: 0,
-                  arrowLeft: arrowLeft.value,
-                  arrowTop: arrowTop.value,
-                  exChange: exChange.value,
-                  beforebgcolor: _ctx.beforebgcolor,
-                  placement: _ctx.placement
-                }, null, 8, ["arrowLeft", "arrowTop", "exChange", "beforebgcolor", "placement"])) : createCommentVNode("", true)
-              ], 6)), [
-                [vShow, shouldShow.value],
-                [unref(vClickoutside), shouldShow.value],
-                [unref(vEsc), shouldShow.value],
-                [unref(vScroll), shouldShow.value]
-              ])
-            ]),
-            _: 3
-          })
-        ], 8, ["to"]))
-      ], 544);
-    };
-  }
-});
+import { _ as _sfc_main } from "../popover.vue_vue_type_script_setup_true_lang/popover.vue_vue_type_script_setup_true_lang.js";
+import "vue";
+import "../index/index.js";
 export {
   _sfc_main as default
 };

package/dist/js/popover.vue_vue_type_script_setup_true_lang/popover.vue_vue_type_script_setup_true_lang.js

@@ -0,0 +1,249 @@
+import { defineComponent, h, normalizeClass, normalizeStyle, ref, computed, nextTick, watch, getCurrentInstance, openBlock, createElementBlock, withModifiers, renderSlot, createBlock, Teleport, unref, createVNode, Transition, withCtx, withDirectives, resolveDynamicComponent, createCommentVNode, vShow } from "vue";
+import { z as zIndexManager, u as usePotion, h as createScrollDirective, i as createBgClickDirective, c as createEscapeDirective, s as selector } from "../index/index.js";
+const PLACEMENT_GROUPS = {
+  top: ["topleft", "topmiddle", "topright"],
+  bottom: ["bottomleft", "bottommiddle", "bottomright"],
+  center: ["centerleft", "centerright"]
+};
+const ARROW_CLASSES = {
+  base: 'absolute w-2.5 h-2.5 before:z-[-1] before:border before:border-gray-300 before:bg-white before:content-border before:rotate-45 before:content-[" "] before:w-2.5 before:h-2.5 before:absolute',
+  top: {
+    normal: "before:border-t-transparent before:border-l-transparent before:rounded-br",
+    exchange: "before:border-b-transparent before:border-r-transparent before:rounded-tl"
+  },
+  bottom: {
+    normal: "before:border-b-transparent before:border-r-transparent before:rounded-tl",
+    exchange: "before:border-t-transparent before:border-l-transparent before:rounded-br"
+  },
+  center: {
+    right: "before:border-r-transparent before:border-t-transparent before:rounded-bl",
+    left: "before:border-l-transparent before:border-b-transparent before:rounded-tr"
+  }
+};
+const arrowComponent = defineComponent({
+  name: "PopArrow",
+  props: {
+    arrowLeft: { type: Number, required: true },
+    arrowTop: { type: Number, required: true },
+    placement: { type: String, required: true },
+    exChange: { type: Boolean, required: true },
+    beforebgcolor: { type: String }
+  },
+  setup(props) {
+    const getArrowStyles = () => {
+      const { placement, exChange, arrowLeft, arrowTop } = props;
+      const isTopGroup = PLACEMENT_GROUPS.top.includes(placement);
+      const isBottomGroup = PLACEMENT_GROUPS.bottom.includes(placement);
+      const isCenterGroup = PLACEMENT_GROUPS.center.includes(placement);
+      return {
+        left: isTopGroup || isBottomGroup ? `${arrowLeft}px` : placement === "centerright" ? "-5px" : null,
+        right: placement === "centerleft" ? "-5px" : null,
+        top: isCenterGroup ? `${arrowTop}px` : isBottomGroup && !exChange || isTopGroup && exChange ? "-5px" : null,
+        bottom: isTopGroup && !exChange || isBottomGroup && exChange ? "-5px" : null
+      };
+    };
+    const getArrowClasses = () => {
+      const { placement, exChange, beforebgcolor } = props;
+      const classes = [ARROW_CLASSES.base, beforebgcolor];
+      if (PLACEMENT_GROUPS.top.includes(placement)) {
+        classes.push(exChange ? ARROW_CLASSES.top.exchange : ARROW_CLASSES.top.normal);
+      }
+      if (PLACEMENT_GROUPS.bottom.includes(placement)) {
+        classes.push(exChange ? ARROW_CLASSES.bottom.exchange : ARROW_CLASSES.bottom.normal);
+      }
+      if (placement === "centerright") {
+        classes.push(ARROW_CLASSES.center.right);
+      }
+      if (placement === "centerleft") {
+        classes.push(ARROW_CLASSES.center.left);
+      }
+      return classes;
+    };
+    return () => h("span", {
+      class: normalizeClass(getArrowClasses()),
+      style: normalizeStyle(getArrowStyles())
+    });
+  }
+});
+const defaultWidth = "200px";
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  __name: "popover",
+  props: {
+    trigger: { default: "click" },
+    width: {},
+    placement: { default: "topleft" },
+    insertClass: {},
+    beforeHidden: {},
+    modelValue: { type: Boolean },
+    beforebgcolor: {},
+    arrowshow: { type: Boolean, default: true },
+    renderType: { default: "show" }
+  },
+  emits: ["update:modelValue"],
+  setup(__props, { expose: __expose, emit: __emit }) {
+    const props = __props;
+    const base = ref();
+    const pop = ref();
+    const isLocalOpen = ref(false);
+    const currentZIndex = ref(zIndexManager.getCurrentZIndex());
+    const shouldShow = computed(() => {
+      if (isLocalOpen.value || props.trigger === "native" && props.modelValue) {
+        nextTick(setPosition);
+      }
+      if (props.trigger === "native") {
+        return props.modelValue;
+      } else {
+        return isLocalOpen.value;
+      }
+    });
+    watch(shouldShow, (newVal) => {
+      if (newVal) {
+        currentZIndex.value = zIndexManager.getNextZIndex();
+      }
+    });
+    const emitAct = __emit;
+    const marginClass = computed(() => {
+      const marginMap = {
+        topleft: "-mt-3",
+        topmiddle: "-mt-3",
+        topright: "-mt-3",
+        bottomleft: "mt-3",
+        bottommiddle: "mt-3",
+        bottomright: "mt-3",
+        centerleft: "-ml-3",
+        centerright: "ml-3"
+      };
+      return marginMap[props.placement];
+    });
+    const showHandle = () => {
+      isLocalOpen.value = true;
+    };
+    const hovershowHandle = () => {
+      if (props.trigger === "hover") {
+        isLocalOpen.value = true;
+      }
+    };
+    const Left = ref(0);
+    const Top = ref(0);
+    const arrowLeft = ref(0);
+    const arrowTop = ref(0);
+    const exChange = ref(false);
+    const setPosition = () => {
+      const { top, bottom } = base.value.getBoundingClientRect();
+      if (top < 0 || bottom > window.innerHeight) {
+        hideHandle();
+        return;
+      }
+      const position = usePotion(base.value, pop.value, {
+        position: props.placement
+      });
+      Top.value = position.Top;
+      Left.value = position.Left;
+      arrowTop.value = position.arrowTop;
+      arrowLeft.value = position.arrowLeft;
+      exChange.value = position.exChange;
+    };
+    const { proxy } = getCurrentInstance();
+    const vScroll = createScrollDirective({
+      onMove: () => {
+        setPosition();
+      },
+      scrollContainerId: (proxy == null ? void 0 : proxy.gloablScrollBar) ? proxy == null ? void 0 : proxy.gloablScrollBar : void 0
+    });
+    const vClickoutside = createBgClickDirective({
+      onCheckOut: (event, el) => {
+        if (el.contains(event.target)) {
+          return;
+        } else if (base.value.contains(event.target)) {
+          return;
+        } else {
+          closeCenter();
+        }
+      },
+      moveModel: props.trigger === "hover"
+    });
+    const vEsc = createEscapeDirective({
+      onEscape: () => {
+        hideHandle();
+      }
+    });
+    const closeCenter = () => {
+      if (props.beforeHidden) {
+        props.beforeHidden(hideHandle);
+      } else {
+        hideHandle();
+      }
+    };
+    const hideHandle = (disablecancelflag) => {
+      if (disablecancelflag === true) {
+        return;
+      } else {
+        if (props.trigger === "native") {
+          emitAct("update:modelValue", false);
+        } else {
+          isLocalOpen.value = false;
+        }
+      }
+    };
+    const widthNum = computed(() => {
+      if (!props.width)
+        return defaultWidth;
+      if (typeof props.width === "number") {
+        return `${props.width}px`;
+      } else if (typeof props.width === "string") {
+        const validUnit = /^(?:\d+(?:\.\d+)?)(?:px|%|em|rem|vw|vh)$/.test(
+          props.width
+        );
+        return validUnit ? props.width : `${props.width}px`;
+      }
+      return defaultWidth;
+    });
+    __expose({
+      hideHandle
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        class: "inline-block",
+        ref_key: "base",
+        ref: base,
+        onClick: showHandle,
+        onMouseenter: withModifiers(hovershowHandle, ["prevent"])
+      }, [
+        renderSlot(_ctx.$slots, "reference"),
+        (openBlock(), createBlock(Teleport, {
+          to: `#${unref(selector)}`
+        }, [
+          createVNode(Transition, { name: "opacity" }, {
+            default: withCtx(() => [
+              withDirectives((openBlock(), createElementBlock("div", {
+                ref_key: "pop",
+                ref: pop,
+                class: normalizeClass(["absolute rounded bg-white p-4 drop-shadow border border-gray-300 box-border", [marginClass.value, __props.insertClass]]),
+                style: normalizeStyle({ width: widthNum.value, top: `${Top.value}px`, left: `${Left.value}px`, "z-index": currentZIndex.value })
+              }, [
+                renderSlot(_ctx.$slots, "default"),
+                __props.arrowshow ? (openBlock(), createBlock(resolveDynamicComponent(unref(arrowComponent)), {
+                  key: 0,
+                  arrowLeft: arrowLeft.value,
+                  arrowTop: arrowTop.value,
+                  exChange: exChange.value,
+                  beforebgcolor: __props.beforebgcolor,
+                  placement: __props.placement
+                }, null, 8, ["arrowLeft", "arrowTop", "exChange", "beforebgcolor", "placement"])) : createCommentVNode("", true)
+              ], 6)), [
+                [vShow, shouldShow.value],
+                [unref(vClickoutside), shouldShow.value],
+                [unref(vEsc), shouldShow.value],
+                [unref(vScroll), shouldShow.value]
+              ])
+            ]),
+            _: 3
+          })
+        ], 8, ["to"]))
+      ], 544);
+    };
+  }
+});
+export {
+  _sfc_main as _
+};