ninemoon-ui 0.0.9 → 0.0.11

package/dist/js/carousel/carousel.js

@@ -1,4 +1,4 @@
-import { defineComponent, useSlots, ref, computed, onMounted, watch, onUnmounted, openBlock, createElementBlock, normalizeStyle, createElementVNode, createVNode, h } from "vue";
+import { defineComponent, useSlots, ref, computed, onMounted, watch, onUnmounted, openBlock, createElementBlock, normalizeStyle, createElementVNode, createVNode, h, normalizeClass } from "vue";
 const _hoisted_1 = /* @__PURE__ */ createElementVNode("svg", {
   class: "tdd-w-4 tdd-h-4 tdd-fill-white tdd-inline-block",
   viewBox: "0 0 1024 1024",
@@ -61,7 +61,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return h(
         "div",
         {
-          class: "carouselBody " + (activeIndex.value === d ? "tdd-z-10" : "-tdd-z-10"),
+          class: normalizeClass(["carouselBody", [activeIndex.value === d ? "tdd-z-10" : "-tdd-z-10"]]),
           style: {
             transform: `translateX(${transformNum}px)`
           }

package/dist/js/check/checkgroup.js

@@ -1,4 +1,4 @@
-import { defineComponent, inject, useSlots, openBlock, createBlock, h, withDirectives, vModelCheckbox } from "vue";
+import { defineComponent, inject, useSlots, openBlock, createBlock, h, normalizeClass, withDirectives, vModelCheckbox } from "vue";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "checkgroup",
   props: {
@@ -15,7 +15,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return h(
         "label",
         {
-          class: "checkGroup " + (MySlot.props.class || "") + (props.modelValue.includes(MySlot.props.label) ? " tdd-bg-wordblue" : "")
+          class: normalizeClass(["checkGroup", [MySlot.props.class, props.modelValue.includes(MySlot.props.label) ? "tdd-bg-wordblue" : ""]])
         },
         [
           withDirectives(
@@ -26,14 +26,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 ParentGetChangeHandle(value);
                 emit("update:modelValue", value);
               },
-              class: "hiddeninput form-tick" + (props.showinput ? "" : " tdd-hidden")
+              class: normalizeClass(["hiddeninput form-tick", [props.showinput ? "" : "tdd-hidden"]])
             }),
             [[vModelCheckbox, props.modelValue]]
           ),
           h(
             "span",
             {
-              class: "tdd-text-sm " + (props.modelValue.includes(MySlot.props.label) ? " tdd-text-white" : " tdd-text-word6")
+              class: normalizeClass(["tdd-text-sm", [props.modelValue.includes(MySlot.props.label) ? "tdd-text-white" : "tdd-text-word6"]])
             },
             ((_a = MySlot.children) == null ? void 0 : _a.default()) || MySlot.props.label
           )

package/dist/js/form/form.js

@@ -24,14 +24,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
     const validate = async (callBack) => {
       let passflag = true;
-      for (const rule of checkList.value) {
+      checkList.value.forEach(async (rule) => {
         await rule.fc((msg) => {
           if (msg !== null && msg !== void 0) {
             passflag = false;
             console.warn(msg);
           }
         });
-      }
+      });
       if (passflag === true) {
         callBack(passflag);
       }

package/dist/js/index/index.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, watch, onUnmounted, openBlock, createBlock, Teleport, createElementVNode, createVNode, TransitionGroup, withCtx, createElementBlock, Fragment, renderList, normalizeClass, createCommentVNode, toDisplayString, resolveDynamicComponent, createApp, reactive, nextTick, defineAsyncComponent } from "vue";
+import { defineComponent, ref, watch, onUnmounted, openBlock, createBlock, Teleport, createElementVNode, createVNode, TransitionGroup, withCtx, createElementBlock, Fragment, renderList, normalizeClass, createCommentVNode, resolveDynamicComponent, h, createApp, reactive, toDisplayString, nextTick, defineAsyncComponent } from "vue";
 const _hoisted_1$2 = { class: "tdd-pointer-events-none tdd-fixed tdd-right-0 tdd-left-0 tdd-bottom-0 tdd-top-4 tdd-z-2000 tdd-space-y-5" };
 const _hoisted_2$2 = { class: "tdd-pointer-events-auto tdd-inline-flex tdd-items-center tdd-space-x-3 tdd-bg-white tdd-p-3 tdd-text-sm tdd-text-word3 tdd-drop-shadow" };
 const _hoisted_3$1 = {
@@ -6,13 +6,9 @@ const _hoisted_3$1 = {
   class: "tdd-h-4 tdd-w-4 tdd-fill-white",
   viewBox: "0 0 1024 1024",
   version: "1.1",
-  xmlns: "http://www.w3.org/2000/svg",
-  "p-id": "2124"
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_4$1 = /* @__PURE__ */ createElementVNode("path", {
-  d: "M883.2 247.466667c-17.066667-17.066667-44.8-17.066667-59.733333 0L409.6 665.6l-209.066667-204.8c-17.066667-17.066667-44.8-17.066667-59.733333 0-17.066667 17.066667-17.066667 44.8 0 59.733333l238.933333 234.666667c8.533333 8.533333 19.2 12.8 29.866667 12.8 10.666667 0 21.333333-4.266667 29.866667-12.8l443.733333-448c17.066667-17.066667 17.066667-42.666667 0-59.733333z",
-  "p-id": "2125"
-}, null, -1);
+const _hoisted_4$1 = /* @__PURE__ */ createElementVNode("path", { d: "M883.2 247.466667c-17.066667-17.066667-44.8-17.066667-59.733333 0L409.6 665.6l-209.066667-204.8c-17.066667-17.066667-44.8-17.066667-59.733333 0-17.066667 17.066667-17.066667 44.8 0 59.733333l238.933333 234.666667c8.533333 8.533333 19.2 12.8 29.866667 12.8 10.666667 0 21.333333-4.266667 29.866667-12.8l443.733333-448c17.066667-17.066667 17.066667-42.666667 0-59.733333z" }, null, -1);
 const _hoisted_5$1 = [
   _hoisted_4$1
 ];
@@ -21,13 +17,9 @@ const _hoisted_6$1 = {
   class: "tdd-h-4 tdd-w-4 tdd-fill-white",
   viewBox: "0 0 1024 1024",
   version: "1.1",
-  xmlns: "http://www.w3.org/2000/svg",
-  "p-id": "762"
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_7$1 = /* @__PURE__ */ createElementVNode("path", {
-  d: "M556.8 512L832 236.8c12.8-12.8 12.8-32 0-44.8-12.8-12.8-32-12.8-44.8 0L512 467.2l-275.2-277.333333c-12.8-12.8-32-12.8-44.8 0-12.8 12.8-12.8 32 0 44.8l275.2 277.333333-277.333333 275.2c-12.8 12.8-12.8 32 0 44.8 6.4 6.4 14.933333 8.533333 23.466666 8.533333s17.066667-2.133333 23.466667-8.533333L512 556.8 787.2 832c6.4 6.4 14.933333 8.533333 23.466667 8.533333s17.066667-2.133333 23.466666-8.533333c12.8-12.8 12.8-32 0-44.8L556.8 512z",
-  "p-id": "763"
-}, null, -1);
+const _hoisted_7$1 = /* @__PURE__ */ createElementVNode("path", { d: "M556.8 512L832 236.8c12.8-12.8 12.8-32 0-44.8-12.8-12.8-32-12.8-44.8 0L512 467.2l-275.2-277.333333c-12.8-12.8-32-12.8-44.8 0-12.8 12.8-12.8 32 0 44.8l275.2 277.333333-277.333333 275.2c-12.8 12.8-12.8 32 0 44.8 6.4 6.4 14.933333 8.533333 23.466666 8.533333s17.066667-2.133333 23.466667-8.533333L512 556.8 787.2 832c6.4 6.4 14.933333 8.533333 23.466667 8.533333s17.066667-2.133333 23.466666-8.533333c12.8-12.8 12.8-32 0-44.8L556.8 512z" }, null, -1);
 const _hoisted_8$1 = [
   _hoisted_7$1
 ];
@@ -36,17 +28,10 @@ const _hoisted_9 = {
   class: "tdd-h-4 tdd-w-4 tdd-fill-white",
   viewBox: "0 0 1024 1024",
   version: "1.1",
-  xmlns: "http://www.w3.org/2000/svg",
-  "p-id": "1618"
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_10 = /* @__PURE__ */ createElementVNode("path", {
-  d: "M512 320m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z",
-  "p-id": "1620"
-}, null, -1);
-const _hoisted_11 = /* @__PURE__ */ createElementVNode("path", {
-  d: "M512 437.333333c-17.066667 0-32 14.933333-32 32v234.666667c0 17.066667 14.933333 32 32 32s32-14.933333 32-32V469.333333c0-17.066667-14.933333-32-32-32z",
-  "p-id": "1621"
-}, null, -1);
+const _hoisted_10 = /* @__PURE__ */ createElementVNode("path", { d: "M512 320m-42.666667 0a42.666667 42.666667 0 1 0 85.333334 0 42.666667 42.666667 0 1 0-85.333334 0Z" }, null, -1);
+const _hoisted_11 = /* @__PURE__ */ createElementVNode("path", { d: "M512 437.333333c-17.066667 0-32 14.933333-32 32v234.666667c0 17.066667 14.933333 32 32 32s32-14.933333 32-32V469.333333c0-17.066667-14.933333-32-32-32z" }, null, -1);
 const _hoisted_12 = [
   _hoisted_10,
   _hoisted_11
@@ -56,19 +41,14 @@ const _hoisted_13 = {
   class: "tdd-h-4 tdd-w-4 tdd-fill-white",
   viewBox: "0 0 1024 1024",
   version: "1.1",
-  xmlns: "http://www.w3.org/2000/svg",
-  "p-id": "1487"
+  xmlns: "http://www.w3.org/2000/svg"
 };
-const _hoisted_14 = /* @__PURE__ */ createElementVNode("path", {
-  d: "M800 625.066667V448c0-117.333333-70.4-217.6-170.666667-262.4-4.266667-61.866667-55.466667-110.933333-117.333333-110.933333s-113.066667 49.066667-117.333333 110.933333c-100.266667 44.8-170.666667 145.066667-170.666667 262.4v177.066667c-57.6 46.933333-85.333333 110.933333-85.333333 185.6 0 17.066667 14.933333 32 32 32h206.933333c14.933333 61.866667 70.4 106.666667 134.4 106.666666s119.466667-44.8 134.4-106.666666H853.333333c17.066667 0 32-14.933333 32-32 0-76.8-27.733333-138.666667-85.333333-185.6zM512 138.666667c19.2 0 36.266667 10.666667 44.8 25.6-14.933333-2.133333-29.866667-4.266667-44.8-4.266667-14.933333 0-29.866667 2.133333-44.8 4.266667 8.533333-14.933333 25.6-25.6 44.8-25.6z m0 746.666666c-29.866667 0-55.466667-17.066667-66.133333-42.666666h134.4c-12.8 25.6-38.4 42.666667-68.266667 42.666666z m-307.2-106.666666c6.4-46.933333 29.866667-83.2 70.4-113.066667 8.533333-6.4 12.8-14.933333 12.8-25.6v-192c0-123.733333 100.266667-224 224-224S736 324.266667 736 448v192c0 10.666667 4.266667 19.2 12.8 25.6 40.533333 29.866667 64 66.133333 70.4 113.066667H204.8z",
-  "p-id": "1488"
-}, null, -1);
+const _hoisted_14 = /* @__PURE__ */ createElementVNode("path", { d: "M800 625.066667V448c0-117.333333-70.4-217.6-170.666667-262.4-4.266667-61.866667-55.466667-110.933333-117.333333-110.933333s-113.066667 49.066667-117.333333 110.933333c-100.266667 44.8-170.666667 145.066667-170.666667 262.4v177.066667c-57.6 46.933333-85.333333 110.933333-85.333333 185.6 0 17.066667 14.933333 32 32 32h206.933333c14.933333 61.866667 70.4 106.666667 134.4 106.666666s119.466667-44.8 134.4-106.666666H853.333333c17.066667 0 32-14.933333 32-32 0-76.8-27.733333-138.666667-85.333333-185.6zM512 138.666667c19.2 0 36.266667 10.666667 44.8 25.6-14.933333-2.133333-29.866667-4.266667-44.8-4.266667-14.933333 0-29.866667 2.133333-44.8 4.266667 8.533333-14.933333 25.6-25.6 44.8-25.6z m0 746.666666c-29.866667 0-55.466667-17.066667-66.133333-42.666666h134.4c-12.8 25.6-38.4 42.666667-68.266667 42.666666z m-307.2-106.666666c6.4-46.933333 29.866667-83.2 70.4-113.066667 8.533333-6.4 12.8-14.933333 12.8-25.6v-192c0-123.733333 100.266667-224 224-224S736 324.266667 736 448v192c0 10.666667 4.266667 19.2 12.8 25.6 40.533333 29.866667 64 66.133333 70.4 113.066667H204.8z" }, null, -1);
 const _hoisted_15 = [
   _hoisted_14
 ];
-const _hoisted_16 = { key: 0 };
-const _hoisted_17 = ["onClick"];
-const _hoisted_18 = /* @__PURE__ */ createElementVNode("svg", {
+const _hoisted_16 = ["onClick"];
+const _hoisted_17 = /* @__PURE__ */ createElementVNode("svg", {
   class: "tdd-h-5 tdd-w-5 tdd-fill-gray-600",
   xmlns: "http://www.w3.org/2000/svg",
   width: "24",
@@ -85,8 +65,8 @@ const _hoisted_18 = /* @__PURE__ */ createElementVNode("svg", {
     })
   ])
 ], -1);
-const _hoisted_19 = [
-  _hoisted_18
+const _hoisted_18 = [
+  _hoisted_17
 ];
 const _sfc_main$2 = /* @__PURE__ */ defineComponent({
   __name: "messagecomponent",
@@ -174,6 +154,25 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
       },
       { deep: true }
     );
+    const contentRender = (props) => {
+      if (Array.isArray(props.c.vnode)) {
+        return props.c.vnode.map((v) => {
+          return createBlock(
+            resolveDynamicComponent(v)
+          );
+        });
+      } else if (props.c.vnode) {
+        return createBlock(
+          resolveDynamicComponent(props.c.vnode)
+        );
+      } else {
+        return h(
+          "div",
+          {},
+          props.c.text
+        );
+      }
+    };
     onUnmounted(() => {
       messageList.value.length = 0;
     });
@@ -208,16 +207,13 @@ const _sfc_main$2 = /* @__PURE__ */ defineComponent({
                       i.type === "warning" ? (openBlock(), createElementBlock("svg", _hoisted_9, _hoisted_12)) : createCommentVNode("", true),
                       i.type === "info" ? (openBlock(), createElementBlock("svg", _hoisted_13, _hoisted_15)) : createCommentVNode("", true)
                     ], 2),
-                    !i.vnode ? (openBlock(), createElementBlock("div", _hoisted_16, toDisplayString(i.text), 1)) : createCommentVNode("", true),
-                    i.vnode instanceof Array ? (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(i.vnode, (j) => {
-                      return openBlock(), createBlock(resolveDynamicComponent(j));
-                    }), 256)) : (openBlock(), createBlock(resolveDynamicComponent(i.vnode), { key: 2 })),
+                    createVNode(contentRender, { c: i }, null, 8, ["c"]),
                     i.showClose ? (openBlock(), createElementBlock("button", {
-                      key: 3,
+                      key: 0,
                       type: "button",
                       class: "tdd-appearance-none",
                       onClick: ($event) => hidden(d)
-                    }, _hoisted_19, 8, _hoisted_17)) : createCommentVNode("", true)
+                    }, _hoisted_18, 8, _hoisted_16)) : createCommentVNode("", true)
                   ])
                 ]);
               }), 128))
@@ -552,49 +548,80 @@ const throttle = (fn, delay) => {
   };
 };
 const usePotion = (baseDom, aimDom, set) => {
-  let Left = 0;
-  let Top = 0;
-  let Width = 0;
-  let Height = 0;
-  const height = aimDom.clientHeight;
-  const width = aimDom.clientWidth;
-  const { left, right, bottom, top } = baseDom.getBoundingClientRect();
+  let left = 0;
+  let top = 0;
+  let arrowleft = 0;
+  let arrowtop = 0;
+  if (!baseDom || !aimDom) {
+    return {
+      Top: top,
+      Left: left,
+      arrowLeft: arrowleft,
+      arrowTop: arrowtop
+    };
+  }
+  const { left: baseLeft, right, bottom, top: baseTop, width: baseWidth } = baseDom.getBoundingClientRect();
+  const { height: aimHeight, width: aimWidth } = aimDom.getBoundingClientRect();
   const scrollTop = document.documentElement.scrollTop || document.body.scrollTop;
   const scrollLeft = document.documentElement.scrollLeft || document.body.scrollLeft;
-  Left = scrollLeft + left;
-  if (set == null ? void 0 : set.position.includes("bottom")) {
-    Top = scrollTop + bottom;
-  }
-  if (set == null ? void 0 : set.position.includes("top")) {
-    Top = scrollTop + top - height;
+  switch (set == null ? void 0 : set.position) {
+    case "bottomleft":
+    case "bottommiddle":
+    case "bottomright":
+      top = scrollTop + bottom;
+      arrowtop = -5;
+      break;
+    case "topleft":
+    case "topmiddle":
+    case "topright":
+      top = scrollTop + baseTop - aimHeight;
+      arrowtop = aimHeight - 5;
+      break;
+    case "centerleft":
+    case "centerright":
+      top = scrollTop + baseTop + (bottom - baseTop - aimHeight) / 2;
+      arrowtop = aimHeight / 2 - 5;
+      break;
   }
-  if (set == null ? void 0 : set.position.includes("middle")) {
-    Left = scrollLeft + left + (right - left - width) / 2;
-  }
-  if (set == null ? void 0 : set.position.includes("center")) {
-    Top = scrollTop + top + (bottom - top) / 2 - height / 2;
-    if (set.position === "centerleft") {
-      Left = scrollLeft + left - width;
-    } else {
-      Left = scrollLeft + right;
-    }
+  switch (set == null ? void 0 : set.position) {
+    case "topleft":
+    case "bottomleft":
+      left = scrollLeft + baseLeft;
+      arrowleft = (right - baseLeft) / 2;
+      break;
+    case "topmiddle":
+    case "bottommiddle":
+      left = scrollLeft + baseLeft + (right - baseLeft - aimWidth) / 2;
+      arrowleft = aimWidth / 2 - 5;
+      break;
+    case "topright":
+    case "bottomright":
+      left = scrollLeft + right - aimWidth;
+      arrowleft = aimWidth - baseWidth + baseWidth / 2 - 5;
+      break;
+    case "centerleft":
+      left = scrollLeft + baseLeft - aimWidth;
+      arrowleft = aimWidth - 5;
+      break;
+    case "centerright":
+      left = scrollLeft + right;
+      arrowleft = -5;
+      break;
   }
-  if (Top + height > window.innerHeight) {
-    Top = scrollTop + window.innerHeight - height - 10;
+  if (top + aimHeight > window.innerHeight) {
+    top = scrollTop + window.innerHeight - aimHeight - 10;
   }
-  if (Top < 0) {
-    Top = 10;
+  if (top < 0) {
+    top = 10;
   }
-  if (Left + width > window.innerWidth) {
-    Left = scrollLeft + right - width;
+  if (left + aimWidth > window.innerWidth) {
+    left = scrollLeft + right - aimWidth;
   }
-  Width = width;
-  Height = height;
   return {
-    Top,
-    Left,
-    Width,
-    Height
+    Top: top,
+    Left: left,
+    arrowLeft: arrowleft,
+    arrowTop: arrowtop
   };
 };
 function getNewArray(array, subGroupLength) {

package/dist/js/popover/popover.js

@@ -1,4 +1,4 @@
-import { defineComponent, ref, computed, watch, nextTick, onUnmounted, openBlock, createElementBlock, withModifiers, renderSlot, createBlock, Teleport, createVNode, Transition, withCtx, withDirectives, normalizeClass, normalizeStyle, createCommentVNode } from "vue";
+import { defineComponent, ref, computed, nextTick, onUnmounted, openBlock, createElementBlock, withModifiers, renderSlot, createBlock, Teleport, Transition, withCtx, withDirectives, normalizeClass, normalizeStyle, createVNode, createCommentVNode, vShow, h } from "vue";
 import { u as usePotion, t as throttle } from "../index/index.js";
 const _hoisted_1 = ["onMouseenter"];
 const _sfc_main = /* @__PURE__ */ defineComponent({
@@ -9,7 +9,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     placement: { default: "topleft" },
     insertClass: {},
     beforeHidden: {},
-    modelValue: { type: Boolean }
+    modelValue: { type: Boolean },
+    beforebgcolor: {},
+    vIF: { type: Boolean, default: true }
   },
   emits: ["update:modelValue"],
   setup(__props, { expose: __expose, emit: emitAct }) {
@@ -17,7 +19,15 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const base = ref();
     const pop = ref();
     const showPop = ref(false);
-    const showPopFlag = computed(() => {
+    const trueFlag = computed(() => {
+      if (showPop.value || props.trigger === "native" && props.modelValue) {
+        nextTick(() => {
+          setPosition();
+        });
+      } else {
+        window.removeEventListener("resize", setPosition);
+        window.removeEventListener("scroll", setPosition, true);
+      }
       if (props.trigger === "native") {
         return props.modelValue;
       } else {
@@ -30,22 +40,41 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         case "topleft":
         case "topmiddle":
         case "topright":
-          margin = "-mt-3";
+          margin = "-tdd-mt-3";
           break;
         case "bottomleft":
         case "bottommiddle":
         case "bottomright":
-          margin = "mt-3";
+          margin = "tdd-mt-3";
           break;
         case "centerleft":
-          margin = "-ml-3";
+          margin = "-tdd-ml-3";
           break;
         case "centerright":
-          margin = "ml-3";
+          margin = "tdd-ml-3";
           break;
       }
       return margin;
     });
+    const arrowHandle = () => {
+      return h(
+        "span",
+        {
+          class: normalizeClass([
+            "tdd-absolute tdd-z-1000 tdd-w-2.5 tdd-h-2.5 before:tdd-bg-white before:tdd-box-border before:tdd-rotate-45 before:tdd-content-[''] before:tdd-w-2.5 before:tdd-h-2.5 before:tdd-absolute",
+            ["topleft", "topmiddle", "topright"].includes(props.placement) ? "before:tdd-border-t-transparent before:tdd-border-l-transparent" : "",
+            ["bottomleft", "bottommiddle", "bottomright"].includes(props.placement) ? "before:tdd-border-b-transparent before:tdd-border-r-transparent" : "",
+            "centerright" == props.placement ? "before:tdd-border-r-transparent before:tdd-border-t-transparent" : "",
+            "centerleft" == props.placement ? "before:tdd-border-l-transparent before:tdd-border-b-transparent" : "",
+            props.beforebgcolor
+          ]),
+          style: {
+            left: `${arrowLeft.value}px`,
+            top: `${arrowTop.value}px`
+          }
+        }
+      );
+    };
     const showHandle = () => {
       showPop.value = true;
     };
@@ -56,37 +85,39 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
     const Left = ref(0);
     const Top = ref(0);
-    watch(showPopFlag, (n) => {
-      if (n === true) {
-        nextTick(() => {
-          setPosition();
-          if (props.trigger === "hover")
-            return;
-          window.addEventListener("resize", setPosition);
-          window.addEventListener("scroll", setPosition, true);
-        });
-      }
-    });
+    const arrowLeft = ref(0);
+    const arrowTop = ref(0);
     const setPosition = () => {
-      let { top, bottom } = base.value.getBoundingClientRect();
+      if (!pop.value) {
+        window.removeEventListener("resize", setPosition);
+        window.removeEventListener("scroll", setPosition, true);
+        return;
+      }
+      const { top, bottom } = base.value.getBoundingClientRect();
       if (top < 0 || bottom > window.innerHeight) {
         if (props.trigger === "native") {
           emitAct("update:modelValue", false);
         } else {
           showPop.value = false;
         }
-        window.removeEventListener("resize", setPosition);
-        window.removeEventListener("scroll", setPosition, true);
         return;
       }
+      window.addEventListener("resize", setPosition);
+      window.addEventListener("scroll", setPosition, true);
       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;
     };
     const vClickoutside = {
       mounted(el, binding) {
+        if (!(el instanceof HTMLElement)) {
+          console.error("el must be an instance of HTMLElement");
+          return;
+        }
         function documentHandler(e) {
           if ((el == null ? void 0 : el.contains) && (el == null ? void 0 : el.contains(e.target))) {
             return false;
@@ -105,6 +136,10 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         }
       },
       beforeUnmount(el) {
+        if (!(el instanceof HTMLElement)) {
+          console.error("el must be an instance of HTMLElement");
+          return;
+        }
         document.removeEventListener("click", el._vueClickOutside_);
         switch (props.trigger) {
           case "hover":
@@ -125,8 +160,6 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       if (disablecancelflag === true) {
         return;
       } else {
-        window.removeEventListener("resize", setPosition);
-        window.removeEventListener("scroll", setPosition, true);
         if (props.trigger === "native") {
           emitAct("update:modelValue", false);
         } else {
@@ -168,24 +201,47 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         renderSlot(_ctx.$slots, "reference"),
         (openBlock(), createBlock(Teleport, {
           to: "body",
-          disabled: !showPopFlag.value
+          disabled: !trueFlag.value
         }, [
-          createVNode(Transition, { name: "opecity" }, {
+          _ctx.vIF ? (openBlock(), createBlock(Transition, {
+            key: 0,
+            name: "opecity"
+          }, {
             default: withCtx(() => [
-              showPopFlag.value ? withDirectives((openBlock(), createElementBlock("div", {
+              trueFlag.value ? withDirectives((openBlock(), createElementBlock("div", {
                 key: 0,
                 ref_key: "pop",
                 ref: pop,
                 class: normalizeClass(["tdd-absolute tdd-z-1000 tdd-rounded tdd-bg-white tdd-p-4 tdd-drop-shadow", [marginClass.value, _ctx.insertClass]]),
                 style: normalizeStyle({ width: widthNum.value, top: `${Top.value}px`, left: `${Left.value}px` })
               }, [
-                renderSlot(_ctx.$slots, "default")
+                renderSlot(_ctx.$slots, "default"),
+                createVNode(arrowHandle)
               ], 6)), [
                 [vClickoutside, closeCenter]
               ]) : createCommentVNode("", true)
             ]),
             _: 3
-          })
+          })) : (openBlock(), createBlock(Transition, {
+            key: 1,
+            name: "opecity"
+          }, {
+            default: withCtx(() => [
+              withDirectives((openBlock(), createElementBlock("div", {
+                ref_key: "pop",
+                ref: pop,
+                class: normalizeClass(["tdd-absolute tdd-z-1000 tdd-rounded tdd-bg-white tdd-p-4 tdd-drop-shadow", [marginClass.value, _ctx.insertClass]]),
+                style: normalizeStyle({ width: widthNum.value, top: `${Top.value}px`, left: `${Left.value}px` })
+              }, [
+                renderSlot(_ctx.$slots, "default"),
+                createVNode(arrowHandle)
+              ], 6)), [
+                [vShow, trueFlag.value],
+                [vClickoutside, closeCenter]
+              ])
+            ]),
+            _: 3
+          }))
         ], 8, ["disabled"]))
       ], 40, _hoisted_1);
     };

package/dist/js/radio/radiogroup.js

@@ -1,4 +1,4 @@
-import { defineComponent, inject, useSlots, openBlock, createBlock, h, withDirectives, vModelRadio } from "vue";
+import { defineComponent, inject, useSlots, openBlock, createBlock, h, normalizeClass, withDirectives, vModelRadio } from "vue";
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "radiogroup",
   props: {
@@ -15,7 +15,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return h(
         "label",
         {
-          class: "radioGroup " + (((_a = MySlot.props) == null ? void 0 : _a.class) || "") + (props.modelValue == MySlot.props.label ? " tdd-bg-wordblue" : "")
+          class: normalizeClass(["radioGroup", [(_a = MySlot.props) == null ? void 0 : _a.class, props.modelValue == MySlot.props.label ? "tdd-bg-wordblue" : ""]])
         },
         [
           withDirectives(
@@ -26,14 +26,14 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
                 ParentGetChangeHandle(value);
                 emit("update:modelValue", value);
               },
-              class: "hiddeninput form-tick" + (props.showinput ? "" : " tdd-hidden")
+              class: normalizeClass(["hiddeninput form-tick", [props.showinput ? "" : "tdd-hidden"]])
             }),
             [[vModelRadio, props.modelValue]]
           ),
           h(
             "span",
             {
-              class: "tdd-text-sm " + (props.modelValue == MySlot.props.label ? " tdd-text-white" : " tdd-text-word6")
+              class: normalizeClass(["tdd-text-sm", [props.modelValue == MySlot.props.label ? "tdd-text-white" : "tdd-text-word6"]])
             },
             ((_b = MySlot.children) == null ? void 0 : _b.default()) || MySlot.props.label
           )

package/dist/js/select/select.js

@@ -1,4 +1,4 @@
-import { defineComponent, defineAsyncComponent, inject, useSlots, ref, computed, openBlock, createBlock, unref, withCtx, createElementVNode, createVNode, h } from "vue";
+import { defineComponent, defineAsyncComponent, inject, useSlots, ref, computed, openBlock, createBlock, unref, withCtx, createElementVNode, createVNode, h, normalizeClass } from "vue";
 const _hoisted_1 = ["value", "disabled", "readonly", "placeholder"];
 const _sfc_main = /* @__PURE__ */ defineComponent({
   __name: "select",
@@ -29,6 +29,8 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       const isThis = optionList.value.filter((v) => v.value === props.modelValue);
       if (isThis.length > 0) {
         return isThis[0].label;
+      } else if (props.modelValue) {
+        return;
       } else {
         emit("update:modelValue", null);
         ParentGetChangeHandle && ParentGetChangeHandle(null);
@@ -45,7 +47,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return h(
         "div",
         {
-          class: `label ${props.modelValue === it.props.value ? "labelselect" : ""}`,
+          class: normalizeClass(["label", [props.modelValue === it.props.value ? "labelselect" : ""]]),
           key: it.props.key,
           onClick: () => {
             emit("update:modelValue", it.props.value);
@@ -63,7 +65,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
         {
           class: "selectOption"
         },
-        slots.default().map((i, j) => {
+        slots.default().map((i, _j) => {
           if (typeof i.children == "string")
             return null;
           if (Array.isArray(i.children)) {
@@ -78,6 +80,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     };
     return (_ctx, _cache) => {
       return openBlock(), createBlock(unref(Pop), {
+        vIF: false,
         trigger: "native",
         modelValue: showOption.value,
         "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => showOption.value = $event),

package/dist/js/table/table.js

@@ -41,7 +41,9 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
     const renderHead = () => {
       return h(
         "thead",
-        { class: props.headclass ? `tdd-text-word6 ${props.headclass}` : "tdd-text-word6" },
+        {
+          class: normalizeClass(["tdd-text-word6", [props.headclass]])
+        },
         slots.default().map((it) => {
           if (typeof it.children == "string")
             return null;
@@ -155,7 +157,7 @@ const _sfc_main = /* @__PURE__ */ defineComponent({
       return h(
         "td",
         {
-          class: props.cellclass ? `tdd-text-center tdd-py-2 ${props.cellclass}` : "tdd-text-center tdd-py-2"
+          class: normalizeClass(["tdd-text-center tdd-py-2", [props.cellclass]])
         },
         ((_a = it.props) == null ? void 0 : _a.type) && it.props.type === "selection" ? h(
           "label",