@nutui/nutui 4.3.0-beta.6 → 4.3.1

package/dist/packages/popover/Popover.js

@@ -1,12 +1,9 @@
-import { ref, computed, onMounted, watch, resolveComponent, openBlock, createElementBlock, Fragment, renderSlot, createCommentVNode, createElementVNode, normalizeClass, normalizeStyle, createVNode, withCtx, renderList, withModifiers, createBlock, resolveDynamicComponent, toDisplayString } from "vue";
+import { ref, computed, onMounted, watch, nextTick, resolveComponent, openBlock, createElementBlock, Fragment, renderSlot, createCommentVNode, createBlock, Teleport, createElementVNode, normalizeClass, normalizeStyle, createVNode, withCtx, renderList, withModifiers, resolveDynamicComponent, toDisplayString } from "vue";
 import { c as createComponent } from "../component-TCzwHGVq.js";
 import { r as renderIcon } from "../renderIcon--EgZu5_5.js";
-import { a as isArray } from "../util-4Jkyw4BJ.js";
-import { u as useRect } from "../index-rf29bejW.js";
+import { u as useRect } from "../index-cp6Ms_Qe.js";
 import { N as NutPopup } from "../index-wY4t0zYt.js";
 import { _ as _export_sfc } from "../_plugin-vue_export-helper-yVxbj29m.js";
-import "@nutui/icons-vue";
-import "../overlay/Overlay.js";
 const { create } = createComponent("popover");
 const _sfc_main = create({
   components: {
@@ -36,8 +33,11 @@ const _sfc_main = create({
     const popoverRef = ref();
     const popoverContentRef = ref();
     const showPopup = ref(props.visible);
-    let rootRect = ref();
-    let conentRootRect = ref();
+    const rootPosition = ref();
+    const elRect = ref({
+      width: 0,
+      height: 0
+    });
     const popoverArrow = computed(() => {
       const prefixCls = "nut-popover-arrow";
       const loca = props.location;
@@ -85,76 +85,72 @@ const _sfc_main = create({
       return str;
     };
     const getRootPosition = computed(() => {
-      let styles = {};
-      if (!rootRect.value || !conentRootRect.value)
+      const styles = {};
+      if (!rootPosition.value)
         return {};
-      const conentWidth = conentRootRect.value.width;
-      const conentHeight = conentRootRect.value.height;
-      const { width, height, left, top } = rootRect.value;
+      const contentWidth = elRect.value.width;
+      const contentHeight = elRect.value.height;
+      const { width, height, left, top, right } = rootPosition.value;
       const { location, offset } = props;
-      const direction = location.split("-")[0];
-      const skew = location.split("-")[1];
+      const direction = location == null ? void 0 : location.split("-")[0];
+      const skew = location == null ? void 0 : location.split("-")[1];
       let cross = 0;
       let parallel = 0;
-      if (isArray(offset) && offset.length == 2) {
+      if (Array.isArray(offset) && (offset == null ? void 0 : offset.length) === 2) {
         cross += Number(offset[1]);
         parallel += Number(offset[0]);
       }
       if (width) {
         if (["bottom", "top"].includes(direction)) {
-          const h = direction == "bottom" ? height + cross : -(conentHeight + cross);
+          const h = direction === "bottom" ? height + cross : -(contentHeight + cross);
           styles.top = `${top + h}px`;
           if (!skew) {
-            styles.left = `${-(conentWidth - width) / 2 + left + parallel}px`;
+            styles.left = `${-(contentWidth - width) / 2 + left + parallel}px`;
           }
-          if (skew == "start") {
+          if (skew === "start") {
             styles.left = `${left + parallel}px`;
           }
-          if (skew == "end") {
-            styles.left = `${rootRect.value.right + parallel}px`;
+          if (skew === "end") {
+            styles.left = `${right + parallel}px`;
           }
         }
         if (["left", "right"].includes(direction)) {
-          const contentW = direction == "left" ? -(conentWidth + cross) : width + cross;
+          const contentW = direction === "left" ? -(contentWidth + cross) : width + cross;
           styles.left = `${left + contentW}px`;
           if (!skew) {
-            styles.top = `${top - conentHeight / 2 + height / 2 - 4 + parallel}px`;
+            styles.top = `${top - contentHeight / 2 + height / 2 - 4 + parallel}px`;
           }
-          if (skew == "start") {
+          if (skew === "start") {
             styles.top = `${top + parallel}px`;
           }
-          if (skew == "end") {
+          if (skew === "end") {
             styles.top = `${top + height + parallel}px`;
           }
         }
       }
       return styles;
     });
-    const customStyle = computed(() => {
-      const styles = {};
-      if (props.bgColor) {
-        styles.background = props.bgColor;
-      }
-      return styles;
-    });
     const getContentWidth = () => {
-      let rect2 = useRect(popoverRef.value);
-      if (props.targetId) {
-        rect2 = useRect(document.querySelector(`#${props.targetId}`));
-      }
-      rootRect.value = rect2;
-      setTimeout(() => {
-        var _a, _b;
-        conentRootRect.value = {
-          height: (_a = popoverContentRef.value) == null ? void 0 : _a.clientHeight,
-          width: (_b = popoverContentRef.value) == null ? void 0 : _b.clientWidth
-        };
-      }, 0);
+      var _a, _b, _c, _d;
+      const rect = useRect(
+        props.targetId ? document.querySelector(`#${props.targetId}`) : popoverRef.value
+      );
+      rootPosition.value = {
+        width: rect.width,
+        height: rect.height,
+        left: rect.left,
+        top: rect.top + Math.max(((_a = document.documentElement) == null ? void 0 : _a.scrollTop) || 0, ((_b = document.body) == null ? void 0 : _b.scrollTop) || 0),
+        right: rect.right
+      };
+      elRect.value = {
+        height: (_c = popoverContentRef.value) == null ? void 0 : _c.clientHeight,
+        width: (_d = popoverContentRef.value) == null ? void 0 : _d.clientWidth
+      };
     };
     onMounted(() => {
       setTimeout(() => {
         getContentWidth();
-      }, 200);
+      }, 300);
     });
     watch(
       () => props.visible,
@@ -162,7 +158,9 @@ const _sfc_main = create({
         showPopup.value = value;
         if (value) {
           window.addEventListener("touchstart", clickAway, true);
-          getContentWidth();
+          nextTick(() => {
+            getContentWidth();
+          });
         } else {
           window.removeEventListener("touchstart", clickAway, true);
         }
@@ -207,7 +205,6 @@ const _sfc_main = create({
       popoverRef,
       popoverContentRef,
       getRootPosition,
-      customStyle,
       popoverArrowStyle,
       renderIcon
     };
@@ -230,49 +227,51 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }, [
       renderSlot(_ctx.$slots, "reference")
     ], 512)) : createCommentVNode("", true),
-    createElementVNode("view", {
-      class: normalizeClass(["nut-popover", `nut-popover--${_ctx.theme}`, `${_ctx.customClass}`]),
-      style: normalizeStyle(_ctx.getRootPosition)
-    }, [
-      createVNode(_component_nut_popup, {
-        visible: _ctx.showPopup,
-        "onUpdate:visible": _cache[1] || (_cache[1] = ($event) => _ctx.showPopup = $event),
-        "pop-class": `nut-popover-content nut-popover-content--${_ctx.location}`,
-        style: normalizeStyle(_ctx.customStyle),
-        position: "",
-        transition: "nut-popover",
-        overlay: _ctx.overlay,
-        duration: _ctx.duration,
-        "overlay-style": _ctx.overlayStyle,
-        "overlay-class": _ctx.overlayClass,
-        "close-on-click-overlay": _ctx.closeOnClickOverlay
-      }, {
-        default: withCtx(() => [
-          createElementVNode("view", _hoisted_1, [
-            _ctx.showArrow ? (openBlock(), createElementBlock("view", {
-              key: 0,
-              class: normalizeClass(_ctx.popoverArrow),
-              style: normalizeStyle(_ctx.popoverArrowStyle)
-            }, null, 6)) : createCommentVNode("", true),
-            renderSlot(_ctx.$slots, "content"),
-            (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.list, (item, index) => {
-              return openBlock(), createElementBlock("view", {
-                key: index,
-                class: normalizeClass([item.className, item.disabled && "nut-popover-menu-disabled", "nut-popover-menu-item"]),
-                onClick: withModifiers(($event) => _ctx.chooseItem(item, index), ["stop"])
-              }, [
-                item.icon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.renderIcon(item.icon)), {
-                  key: 0,
-                  class: "nut-popover-item-img"
-                })) : createCommentVNode("", true),
-                createElementVNode("view", _hoisted_3, toDisplayString(item.name), 1)
-              ], 10, _hoisted_2);
-            }), 128))
-          ], 512)
-        ]),
-        _: 3
-      }, 8, ["visible", "pop-class", "style", "overlay", "duration", "overlay-style", "overlay-class", "close-on-click-overlay"])
-    ], 6)
+    (openBlock(), createBlock(Teleport, { to: "body" }, [
+      createElementVNode("div", {
+        class: normalizeClass(["nut-popover", `nut-popover--${_ctx.theme}`, `${_ctx.customClass}`]),
+        style: normalizeStyle(_ctx.getRootPosition)
+      }, [
+        createVNode(_component_nut_popup, {
+          visible: _ctx.showPopup,
+          "onUpdate:visible": _cache[1] || (_cache[1] = ($event) => _ctx.showPopup = $event),
+          "pop-class": `nut-popover-content nut-popover-content--${_ctx.location}`,
+          style: normalizeStyle({ background: _ctx.bgColor }),
+          position: "",
+          transition: "nut-popover",
+          overlay: _ctx.overlay,
+          duration: _ctx.duration,
+          "overlay-style": _ctx.overlayStyle,
+          "overlay-class": _ctx.overlayClass,
+          "close-on-click-overlay": _ctx.closeOnClickOverlay
+        }, {
+          default: withCtx(() => [
+            createElementVNode("div", _hoisted_1, [
+              _ctx.showArrow ? (openBlock(), createElementBlock("div", {
+                key: 0,
+                class: normalizeClass(_ctx.popoverArrow),
+                style: normalizeStyle(_ctx.popoverArrowStyle)
+              }, null, 6)) : createCommentVNode("", true),
+              renderSlot(_ctx.$slots, "content"),
+              (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.list, (item, index) => {
+                return openBlock(), createElementBlock("div", {
+                  key: index,
+                  class: normalizeClass([item.className, item.disabled && "nut-popover-menu-disabled", "nut-popover-menu-item"]),
+                  onClick: withModifiers(($event) => _ctx.chooseItem(item, index), ["stop"])
+                }, [
+                  item.icon ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.renderIcon(item.icon)), {
+                    key: 0,
+                    class: "nut-popover-item-img"
+                  })) : createCommentVNode("", true),
+                  createElementVNode("div", _hoisted_3, toDisplayString(item.name), 1)
+                ], 10, _hoisted_2);
+              }), 128))
+            ], 512)
+          ]),
+          _: 3
+        }, 8, ["visible", "pop-class", "style", "overlay", "duration", "overlay-style", "overlay-class", "close-on-click-overlay"])
+      ], 6)
+    ]))
   ], 64);
 }
 const NutPopover = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render]]);

package/dist/packages/popover/index.css

@@ -1 +1 @@
-.overlay-fade-enter-active,.overlay-fade-leave-active{transition-property:opacity;transition-timing-function:ease}.overlay-fade-enter-from,.overlay-fade-leave-to{opacity:0}.nut-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--nut-overlay-bg-color, rgba(0, 0, 0, 0.7))}.nut-overflow-hidden{overflow:hidden !important}.nut-theme-dark .nut-popup{background:var(--nut-dark-background2, #1b1b1b)}.nut-theme-dark .nut-popup__close-icon{color:var(--nut-dark-color, var(--nut-white, #fff))}.nut-popup-slide-center-enter-active,.nut-popup-slide-center-leave-active{transition-property:opacity;transition-timing-function:ease}.nut-popup-slide-center-enter-from,.nut-popup-slide-center-leave-to{opacity:0}.nut-popup-slide-top-enter-from,.nut-popup-slide-top-leave-active{transform:translate(0, -100%)}.nut-popup-slide-right-enter-from,.nut-popup-slide-right-leave-active{transform:translate(100%, 0)}.nut-popup-slide-bottom-enter-from,.nut-popup-slide-bottom-leave-active{transform:translate(0, 100%)}.nut-popup-slide-left-enter-from,.nut-popup-slide-left-leave-active{transform:translate(-100%, 0)}.nut-popup--center{top:50%;left:50%;transform:translate(-50%, -50%)}.nut-popup--center.round{border-radius:var(--nut-popup-border-radius, 20px)}.nut-popup--bottom{bottom:0;left:0;width:100%}.nut-popup--bottom.round{border-radius:var(--nut-popup-border-radius, 20px) var(--nut-popup-border-radius, 20px) 0 0}.nut-popup--bottom--safebottom{padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom)}.nut-popup--right{top:0;right:0}.nut-popup--right.round{border-radius:var(--nut-popup-border-radius, 20px) 0 0 var(--nut-popup-border-radius, 20px)}.nut-popup--left{top:0;left:0}.nut-popup--left.round{border-radius:0 var(--nut-popup-border-radius, 20px) var(--nut-popup-border-radius, 20px) 0}.nut-popup--top{top:0;left:0;width:100%}.nut-popup--top.round{border-radius:0 0 var(--nut-popup-border-radius, 20px) var(--nut-popup-border-radius, 20px)}.nut-popup{position:fixed;max-height:100%;overflow-y:auto;background-color:var(--nut-white, #fff);-webkit-overflow-scrolling:touch}.nut-popup__close-icon{position:absolute !important;z-index:1;color:#969799;font-size:18px;cursor:pointer;width:30px;height:30px;line-height:30px;text-align:center}.nut-popup__close-icon:active{opacity:.7}.nut-popup__close-icon--top-left{top:var(--nut-popup-close-icon-margin, 16px);left:var(--nut-popup-close-icon-margin, 16px)}.nut-popup__close-icon--top-right{top:var(--nut-popup-close-icon-margin, 16px);right:var(--nut-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-left{bottom:var(--nut-popup-close-icon-margin, 16px);left:var(--nut-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-right{right:var(--nut-popup-close-icon-margin, 16px);bottom:var(--nut-popup-close-icon-margin, 16px)}.nut-popover{position:absolute;display:inline-block;word-break:normal}.nut-popover .nut-popover-arrow{position:absolute;width:0;height:0;border:8px solid rgba(0,0,0,0)}.nut-popover .nut-popover-arrow-top{bottom:0;border-top-color:var(--nut-popover-white-background-color, rgb(255, 255, 255));border-bottom-width:0;margin-bottom:-8px}.nut-popover .nut-popover-arrow-bottom{top:0px;border-bottom-color:var(--nut-popover-white-background-color, rgb(255, 255, 255));border-top-width:0;margin-top:-8px}.nut-popover .nut-popover-arrow-bottom.nut-popover-arrow--bottom{left:50%;transform:translateX(-50%)}.nut-popover .nut-popover-arrow-bottom.nut-popover-arrow--bottom-start{left:16px;transform:translateX(0%)}.nut-popover .nut-popover-arrow-bottom.nut-popover-arrow--bottom-end{right:16px;transform:translateX(0%)}.nut-popover .nut-popover-arrow-left{right:0px;border-left-color:var(--nut-popover-white-background-color, rgb(255, 255, 255));border-right-width:0;margin-right:-8px}.nut-popover .nut-popover-arrow-left.nut-popover-arrow--left{top:50%;transform:translateY(-50%)}.nut-popover .nut-popover-arrow-left.nut-popover-arrow--left-start{top:16px;transform:translateY(0%)}.nut-popover .nut-popover-arrow-left.nut-popover-arrow--left-end{bottom:16px;transform:translateY(0%)}.nut-popover .nut-popover-arrow-right{left:0px;border-right-color:var(--nut-popover-white-background-color, rgb(255, 255, 255));border-left-width:0;margin-left:-8px}.nut-popover .nut-popover-arrow-right.nut-popover-arrow--right{top:50%;transform:translateY(-50%)}.nut-popover .nut-popover-arrow-right.nut-popover-arrow--right-start{top:16px;transform:translateY(0%)}.nut-popover .nut-popover-arrow-right.nut-popover-arrow--right-end{bottom:16px;transform:translateY(0%)}.nut-popover .nut-popover-content{position:absolute;z-index:9999;background:#fff;border-radius:5px;font-size:14px;font-weight:normal;color:#333;box-shadow:0 2px 12px rgba(50,50,51,.1215686275);opacity:1;transition:opacity .15s,transform .15s;max-height:initial;overflow-y:initial}.nut-popover .nut-popover-content-group{display:block;height:100%;width:100%}.nut-popover .nut-popover-content .nut-popover-menu-item{display:block;padding:8px;border-bottom:1px solid var(--nut-popover-border-bottom-color, rgb(229, 229, 229))}.nut-popover .nut-popover-content .nut-popover-menu-item:first-child{margin-top:15px}.nut-popover .nut-popover-content .nut-popover-menu-item:last-child{margin-bottom:2px;border-bottom:none}.nut-popover .nut-popover-content .nut-popover-menu-item .nut-popover-item-img{vertical-align:top;margin-right:3px}.nut-popover .nut-popover-content .nut-popover-menu-item .nut-popover-menu-item-name{width:100%;word-break:keep-all}.nut-popover .nut-popover-content .nut-popover-menu-item.nut-popover-menu-disabled{color:var(--nut-popover-disable-color, rgb(154, 155, 157));cursor:not-allowed}.nut-popover .nut-popover-content .nut-popover-menu-item.nut-popover-menu-taroitem{display:flex}.nut-popover .nut-popover-content--top .nut-popover-arrow--top{left:50%;transform:translateX(-50%)}.nut-popover .nut-popover-content--top-end{right:0}.nut-popover .nut-popover-content--top-end .nut-popover-arrow--top-end{right:16px;transform:translateX(0%)}.nut-popover .nut-popover-content--top-start{left:0}.nut-popover .nut-popover-content--top-start .nut-popover-arrow--top-start{left:16px;transform:translateX(0%)}.nut-popover .nut-popover-content--bottom-end{right:0}.nut-popover .nut-popover-content--left-end{bottom:0}.nut-popover .nut-popover-content--left-start{top:0}.nut-popover .nut-popover-content--right-end{bottom:0}.nut-popover .nut-popover-content--right-start{top:0}.nut-popover--dark .nut-popover-content{background:var(--nut-popover-dark-background-color, rgb(75, 76, 77));color:var(--nut-popover-white-background-color, rgb(255, 255, 255))}.nut-popover--dark .nut-popover-content--bottom .nut-popover-arrow,.nut-popover--dark .nut-popover-content--bottom-start .nut-popover-arrow,.nut-popover--dark .nut-popover-content--bottom-end .nut-popover-arrow{border-bottom-color:var(--nut-popover-dark-background-color, rgb(75, 76, 77))}.nut-popover--dark .nut-popover-content--top .nut-popover-arrow,.nut-popover--dark .nut-popover-content--top-start .nut-popover-arrow,.nut-popover--dark .nut-popover-content--top-end .nut-popover-arrow{border-top-color:var(--nut-popover-dark-background-color, rgb(75, 76, 77))}.nut-popover--dark .nut-popover-content--left .nut-popover-arrow,.nut-popover--dark .nut-popover-content--left-start .nut-popover-arrow,.nut-popover--dark .nut-popover-content--left-end .nut-popover-arrow{border-left-color:var(--nut-popover-dark-background-color, rgb(75, 76, 77))}.nut-popover--dark .nut-popover-content--right .nut-popover-arrow,.nut-popover--dark .nut-popover-content--right-start .nut-popover-arrow,.nut-popover--dark .nut-popover-content--right-end .nut-popover-arrow{border-right-color:var(--nut-popover-dark-background-color, rgb(75, 76, 77))}.nut-popover-enter-from,.nut-popover-leave-active{transform:scale(0.8);opacity:0}.nut-popover-enter-active{transition-timing-function:ease-out}.nut-popover-leave-active{transition-timing-function:ease-in}.nut-popover-content-bg{position:fixed;height:100%;width:100%;top:0;left:0;background:rgba(0,0,0,0);z-index:1999}.nut-popover-wrapper{display:inline-block}.nut-popover-content-copy{position:absolute;top:-99999px}
+.overlay-fade-enter-active,.overlay-fade-leave-active{transition-property:opacity;transition-timing-function:ease}.overlay-fade-enter-from,.overlay-fade-leave-to{opacity:0}.nut-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:var(--nut-overlay-bg-color, rgba(0, 0, 0, 0.7))}.nut-overflow-hidden{overflow:hidden !important}.nut-theme-dark .nut-popup{background:var(--nut-dark-background2, #1b1b1b)}.nut-theme-dark .nut-popup__close-icon{color:var(--nut-dark-color, var(--nut-white, #fff))}.nut-popup-slide-center-enter-active,.nut-popup-slide-center-leave-active{transition-property:opacity;transition-timing-function:ease}.nut-popup-slide-center-enter-from,.nut-popup-slide-center-leave-to{opacity:0}.nut-popup-slide-top-enter-from,.nut-popup-slide-top-leave-active{transform:translate(0, -100%)}.nut-popup-slide-right-enter-from,.nut-popup-slide-right-leave-active{transform:translate(100%, 0)}.nut-popup-slide-bottom-enter-from,.nut-popup-slide-bottom-leave-active{transform:translate(0, 100%)}.nut-popup-slide-left-enter-from,.nut-popup-slide-left-leave-active{transform:translate(-100%, 0)}.nut-popup--center{top:50%;left:50%;transform:translate(-50%, -50%)}.nut-popup--center.round{border-radius:var(--nut-popup-border-radius, 20px)}.nut-popup--bottom{bottom:0;left:0;width:100%}.nut-popup--bottom.round{border-radius:var(--nut-popup-border-radius, 20px) var(--nut-popup-border-radius, 20px) 0 0}.nut-popup--bottom--safebottom{padding-bottom:constant(safe-area-inset-bottom);padding-bottom:env(safe-area-inset-bottom)}.nut-popup--right{top:0;right:0}.nut-popup--right.round{border-radius:var(--nut-popup-border-radius, 20px) 0 0 var(--nut-popup-border-radius, 20px)}.nut-popup--left{top:0;left:0}.nut-popup--left.round{border-radius:0 var(--nut-popup-border-radius, 20px) var(--nut-popup-border-radius, 20px) 0}.nut-popup--top{top:0;left:0;width:100%}.nut-popup--top.round{border-radius:0 0 var(--nut-popup-border-radius, 20px) var(--nut-popup-border-radius, 20px)}.nut-popup{position:fixed;max-height:100%;overflow-y:auto;background-color:var(--nut-white, #fff);-webkit-overflow-scrolling:touch}.nut-popup__close-icon{position:absolute !important;z-index:1;color:#969799;font-size:18px;cursor:pointer;width:30px;height:30px;line-height:30px;text-align:center}.nut-popup__close-icon:active{opacity:.7}.nut-popup__close-icon--top-left{top:var(--nut-popup-close-icon-margin, 16px);left:var(--nut-popup-close-icon-margin, 16px)}.nut-popup__close-icon--top-right{top:var(--nut-popup-close-icon-margin, 16px);right:var(--nut-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-left{bottom:var(--nut-popup-close-icon-margin, 16px);left:var(--nut-popup-close-icon-margin, 16px)}.nut-popup__close-icon--bottom-right{right:var(--nut-popup-close-icon-margin, 16px);bottom:var(--nut-popup-close-icon-margin, 16px)}.nut-popover{position:absolute;display:inline-block;word-break:normal}.nut-popover .nut-popover-arrow{position:absolute;width:0;height:0;border:8px solid rgba(0,0,0,0)}.nut-popover .nut-popover-arrow-top{bottom:0;border-top-color:var(--nut-popover-white-background-color, rgb(255, 255, 255));border-bottom-width:0;margin-bottom:-8px}.nut-popover .nut-popover-arrow-bottom{top:0px;border-bottom-color:var(--nut-popover-white-background-color, rgb(255, 255, 255));border-top-width:0;margin-top:-8px}.nut-popover .nut-popover-arrow-bottom.nut-popover-arrow--bottom{left:50%;transform:translateX(-50%)}.nut-popover .nut-popover-arrow-bottom.nut-popover-arrow--bottom-start{left:16px;transform:translateX(0%)}.nut-popover .nut-popover-arrow-bottom.nut-popover-arrow--bottom-end{right:16px;transform:translateX(0%)}.nut-popover .nut-popover-arrow-left{right:0px;border-left-color:var(--nut-popover-white-background-color, rgb(255, 255, 255));border-right-width:0;margin-right:-8px}.nut-popover .nut-popover-arrow-left.nut-popover-arrow--left{top:50%;transform:translateY(-50%)}.nut-popover .nut-popover-arrow-left.nut-popover-arrow--left-start{top:16px;transform:translateY(0%)}.nut-popover .nut-popover-arrow-left.nut-popover-arrow--left-end{bottom:16px;transform:translateY(0%)}.nut-popover .nut-popover-arrow-right{left:0px;border-right-color:var(--nut-popover-white-background-color, rgb(255, 255, 255));border-left-width:0;margin-left:-8px}.nut-popover .nut-popover-arrow-right.nut-popover-arrow--right{top:50%;transform:translateY(-50%)}.nut-popover .nut-popover-arrow-right.nut-popover-arrow--right-start{top:16px;transform:translateY(0%)}.nut-popover .nut-popover-arrow-right.nut-popover-arrow--right-end{bottom:16px;transform:translateY(0%)}.nut-popover .nut-popover-content{position:absolute;z-index:9999;background:#fff;border-radius:5px;font-size:14px;font-weight:normal;color:#333;box-shadow:0 2px 12px rgba(50,50,51,.1215686275);opacity:1;transition:opacity .15s,transform .15s;max-height:initial;overflow-y:initial}.nut-popover .nut-popover-content-group{display:block;height:100%;width:100%}.nut-popover .nut-popover-content .nut-popover-menu-item{display:flex;align-items:center;padding:8px;border-bottom:1px solid var(--nut-popover-border-bottom-color, rgb(229, 229, 229))}.nut-popover .nut-popover-content .nut-popover-menu-item:first-child{margin-top:15px}.nut-popover .nut-popover-content .nut-popover-menu-item:last-child{margin-bottom:2px;border-bottom:none}.nut-popover .nut-popover-content .nut-popover-menu-item .nut-popover-item-img{vertical-align:top;margin-right:3px}.nut-popover .nut-popover-content .nut-popover-menu-item .nut-popover-menu-item-name{width:100%;text-align:center;word-break:keep-all}.nut-popover .nut-popover-content .nut-popover-menu-item.nut-popover-menu-disabled{color:var(--nut-popover-disable-color, rgb(154, 155, 157));cursor:not-allowed}.nut-popover .nut-popover-content--top .nut-popover-arrow--top{left:50%;transform:translateX(-50%)}.nut-popover .nut-popover-content--top-end{right:0}.nut-popover .nut-popover-content--top-end .nut-popover-arrow--top-end{right:16px;transform:translateX(0%)}.nut-popover .nut-popover-content--top-start{left:0}.nut-popover .nut-popover-content--top-start .nut-popover-arrow--top-start{left:16px;transform:translateX(0%)}.nut-popover .nut-popover-content--bottom-end{right:0}.nut-popover .nut-popover-content--left-end{bottom:0}.nut-popover .nut-popover-content--left-start{top:0}.nut-popover .nut-popover-content--right-end{bottom:0}.nut-popover .nut-popover-content--right-start{top:0}.nut-popover--dark .nut-popover-content{background:var(--nut-popover-dark-background-color, rgb(75, 76, 77));color:var(--nut-popover-white-background-color, rgb(255, 255, 255))}.nut-popover--dark .nut-popover-content--bottom .nut-popover-arrow,.nut-popover--dark .nut-popover-content--bottom-start .nut-popover-arrow,.nut-popover--dark .nut-popover-content--bottom-end .nut-popover-arrow{border-bottom-color:var(--nut-popover-dark-background-color, rgb(75, 76, 77))}.nut-popover--dark .nut-popover-content--top .nut-popover-arrow,.nut-popover--dark .nut-popover-content--top-start .nut-popover-arrow,.nut-popover--dark .nut-popover-content--top-end .nut-popover-arrow{border-top-color:var(--nut-popover-dark-background-color, rgb(75, 76, 77))}.nut-popover--dark .nut-popover-content--left .nut-popover-arrow,.nut-popover--dark .nut-popover-content--left-start .nut-popover-arrow,.nut-popover--dark .nut-popover-content--left-end .nut-popover-arrow{border-left-color:var(--nut-popover-dark-background-color, rgb(75, 76, 77))}.nut-popover--dark .nut-popover-content--right .nut-popover-arrow,.nut-popover--dark .nut-popover-content--right-start .nut-popover-arrow,.nut-popover--dark .nut-popover-content--right-end .nut-popover-arrow{border-right-color:var(--nut-popover-dark-background-color, rgb(75, 76, 77))}.nut-popover-enter-from,.nut-popover-leave-active{transform:scale(0.8);opacity:0}.nut-popover-enter-active{transition-timing-function:ease-out}.nut-popover-leave-active{transition-timing-function:ease-in}.nut-popover-content-bg{position:fixed;height:100%;width:100%;top:0;left:0;background:rgba(0,0,0,0);z-index:1999}.nut-popover-wrapper{display:inline-block}

package/dist/packages/popover/index.scss

@@ -109,8 +109,8 @@
     }
 
     .nut-popover-menu-item {
-      display: block;
-      // padding-bottom: 8px;
+      display: flex;
+      align-items: center;
       padding: 8px;
       border-bottom: 1px solid $popover-border-bottom-color;
 
@@ -130,6 +130,7 @@
 
       .nut-popover-menu-item-name {
         width: 100%;
+        text-align: center;
         word-break: keep-all;
       }
 
@@ -137,10 +138,6 @@
         color: $popover-disable-color;
         cursor: not-allowed;
       }
-
-      &.nut-popover-menu-taroitem {
-        display: flex;
-      }
     }
 
     &--top {
@@ -256,9 +253,3 @@
 .nut-popover-wrapper {
   display: inline-block;
 }
-
-// Taro
-.nut-popover-content-copy {
-  position: absolute;
-  top: -99999px;
-}

package/dist/packages/popup/Popup.js

@@ -1,10 +1,6 @@
 import { N } from "../index-wY4t0zYt.js";
 import "vue";
 import "../_plugin-vue_export-helper-yVxbj29m.js";
-import "@nutui/icons-vue";
-import "../overlay/Overlay.js";
-import "../component-TCzwHGVq.js";
-import "../util-4Jkyw4BJ.js";
 export {
   N as default
 };

package/dist/packages/pullrefresh/PullRefresh.js

@@ -26,7 +26,6 @@ import { u as useScrollParent } from "../index-xDfQLRen.js";
 import { Loading } from "@nutui/icons-vue";
 import { u as useLocale } from "../index-s3RgMhc7.js";
 import { _ as _export_sfc } from "../_plugin-vue_export-helper-yVxbj29m.js";
-import "@nutui/nutui/dist/packages/locale/lang";
 const { create } = createComponent("pull-refresh");
 const cN = "NutPullRefresh";
 const _sfc_main = create({

package/dist/packages/radio/Radio.js

@@ -1,9 +1,4 @@
-import { _ as _sfc_main } from "../index.vue_vue_type_script_lang-MJYVRFbp.js";
-import "vue";
-import "../component-TCzwHGVq.js";
-import "@nutui/icons-vue";
-import "../pxCheck-OnXlN1NC.js";
-import "../types-odSRziQJ.js";
+import { _ as _sfc_main } from "../index.vue_vue_type_script_lang-w2sgcysj.js";
 export {
   _sfc_main as default
 };

package/dist/packages/radiogroup/RadioGroup.js

@@ -1,7 +1,4 @@
 import { _ as _sfc_main } from "../index.vue_vue_type_script_lang-54PRh3YM.js";
-import "vue";
-import "../component-TCzwHGVq.js";
-import "../types-odSRziQJ.js";
 export {
   _sfc_main as default
 };

package/dist/packages/range/Range.js

@@ -17,11 +17,12 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-import { ref, computed, toRefs, openBlock, createElementBlock, normalizeClass, toDisplayString, createCommentVNode, createElementVNode, normalizeStyle, withModifiers, Fragment, renderList, createTextVNode, renderSlot } from "vue";
+import { toRef, ref, computed, toRefs, openBlock, createElementBlock, normalizeClass, toDisplayString, createCommentVNode, createElementVNode, normalizeStyle, withModifiers, Fragment, renderList, createTextVNode, renderSlot } from "vue";
 import { c as createComponent } from "../component-TCzwHGVq.js";
 import { a as isArray } from "../util-4Jkyw4BJ.js";
 import { u as useTouch } from "../index-084nl_oE.js";
-import { u as useRect } from "../index-rf29bejW.js";
+import { u as useRect } from "../index-cp6Ms_Qe.js";
+import { u as useFormDisabled } from "../common-LvGbU-A3.js";
 import { _ as _export_sfc } from "../_plugin-vue_export-helper-yVxbj29m.js";
 const { componentName, create } = createComponent("range");
 const _sfc_main = create({
@@ -69,6 +70,7 @@ const _sfc_main = create({
   },
   emits: ["change", "dragEnd", "dragStart", "update:modelValue"],
   setup(props, { emit }) {
+    const disabled = useFormDisabled(toRef(props, "disabled"));
     const buttonIndex = ref(0);
     let startValue;
     let currentValue;
@@ -86,7 +88,7 @@ const _sfc_main = create({
       const prefixCls = componentName;
       return {
         [prefixCls]: true,
-        [`${prefixCls}-disabled`]: props.disabled,
+        [`${prefixCls}-disabled`]: disabled.value,
         [`${prefixCls}-vertical`]: props.vertical,
         [`${prefixCls}-show-number`]: !props.hiddenRange
       };
@@ -211,7 +213,7 @@ const _sfc_main = create({
       }
     };
     const onClick = (event) => {
-      if (props.disabled) {
+      if (disabled.value) {
         return;
       }
       const { min, modelValue } = props;
@@ -236,7 +238,7 @@ const _sfc_main = create({
       }
     };
     const onTouchStart = (event) => {
-      if (props.disabled) {
+      if (disabled.value) {
         return;
       }
       touch.start(event);
@@ -249,7 +251,7 @@ const _sfc_main = create({
       dragStatus.value = "start";
     };
     const onTouchMove = (event) => {
-      if (props.disabled) {
+      if (disabled.value) {
         return;
       }
       if (dragStatus.value === "start") {
@@ -274,7 +276,7 @@ const _sfc_main = create({
       updateValue(currentValue);
     };
     const onTouchEnd = () => {
-      if (props.disabled) {
+      if (disabled.value) {
         return;
       }
       if (dragStatus.value === "draging") {
@@ -304,7 +306,8 @@ const _sfc_main = create({
       markClassName,
       marksStyle,
       marksList,
-      tickStyle
+      tickStyle,
+      disabled
     });
   }
 });

package/dist/packages/rate/Rate.js

@@ -17,12 +17,13 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-import { ref, openBlock, createElementBlock, Fragment, renderList, normalizeStyle, createElementVNode, createBlock, resolveDynamicComponent, normalizeClass, createCommentVNode } from "vue";
+import { toRef, ref, openBlock, createElementBlock, Fragment, renderList, normalizeStyle, createElementVNode, createBlock, resolveDynamicComponent, normalizeClass, createCommentVNode } from "vue";
 import { StarFillN } from "@nutui/icons-vue";
 import { c as createComponent } from "../component-TCzwHGVq.js";
 import { r as renderIcon } from "../renderIcon--EgZu5_5.js";
 import { p as pxCheck } from "../pxCheck-OnXlN1NC.js";
 import { u as useTouch } from "../index-084nl_oE.js";
+import { u as useFormDisabled } from "../common-LvGbU-A3.js";
 import { _ as _export_sfc } from "../_plugin-vue_export-helper-yVxbj29m.js";
 const { create } = createComponent("rate");
 const _sfc_main = create({
@@ -77,13 +78,14 @@ const _sfc_main = create({
   components: { StarFillN },
   emits: ["update:modelValue", "change"],
   setup(props, { emit, slots }) {
+    const disabled = useFormDisabled(toRef(props, "disabled"));
     const rateRefs = ref([]);
     const updateVal = (value) => {
       emit("update:modelValue", value);
       emit("change", value);
     };
     const onClick = (e, index) => {
-      if (props.disabled || props.readonly)
+      if (disabled.value || props.readonly)
         return;
       let value = 0;
       if (index === 1 && props.modelValue === index) {
@@ -137,7 +139,8 @@ const _sfc_main = create({
       rateRefs,
       refRandomId,
       renderIcon,
-      slots
+      slots,
+      disabled
     });
   }
 });

package/dist/packages/searchbar/Searchbar.js

@@ -17,14 +17,13 @@ var __spreadValues = (a, b) => {
   return a;
 };
 var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
-import { reactive, computed, ref, onMounted, toRefs, openBlock, createElementBlock, normalizeClass, normalizeStyle, toDisplayString, createCommentVNode, renderSlot, createElementVNode, withModifiers, withDirectives, createBlock, resolveDynamicComponent, vShow } from "vue";
+import { toRef, reactive, computed, ref, onMounted, toRefs, openBlock, createElementBlock, normalizeClass, normalizeStyle, toDisplayString, createCommentVNode, renderSlot, createElementVNode, withModifiers, withDirectives, createBlock, resolveDynamicComponent, vShow } from "vue";
 import { c as createComponent } from "../component-TCzwHGVq.js";
 import { r as renderIcon } from "../renderIcon--EgZu5_5.js";
 import { CircleClose } from "@nutui/icons-vue";
 import { u as useLocale } from "../index-s3RgMhc7.js";
+import { u as useFormDisabled } from "../common-LvGbU-A3.js";
 import { _ as _export_sfc } from "../_plugin-vue_export-helper-yVxbj29m.js";
-import "@nutui/nutui/dist/packages/locale/lang";
-import "../util-4Jkyw4BJ.js";
 const { create } = createComponent("searchbar");
 const cN = "NutSearchbar";
 const _sfc_main = create({
@@ -106,6 +105,7 @@ const _sfc_main = create({
     "clickRightIcon"
   ],
   setup(props, { emit }) {
+    const disabled = useFormDisabled(toRef(props, "disabled"));
     const translate = useLocale(cN);
     const state = reactive({
       active: false
@@ -194,7 +194,8 @@ const _sfc_main = create({
       clickInput,
       leftIconClick,
       rightIconClick,
-      styleSearchbar
+      styleSearchbar,
+      disabled
     });
   }
 });

package/dist/packages/shortpassword/ShortPassword.js

@@ -4,9 +4,6 @@ import { N as NutPopup } from "../index-wY4t0zYt.js";
 import { Tips } from "@nutui/icons-vue";
 import { u as useLocale } from "../index-s3RgMhc7.js";
 import { _ as _export_sfc } from "../_plugin-vue_export-helper-yVxbj29m.js";
-import "../overlay/Overlay.js";
-import "../util-4Jkyw4BJ.js";
-import "@nutui/nutui/dist/packages/locale/lang";
 const { create } = createComponent("short-password");
 const cN = "NutShortPassword";
 const _sfc_main = create({

package/dist/packages/signature/Signature.js

@@ -22,10 +22,6 @@ import { c as createComponent } from "../component-TCzwHGVq.js";
 import { Button as _sfc_main$1 } from "../button/Button.js";
 import { u as useLocale } from "../index-s3RgMhc7.js";
 import { _ as _export_sfc } from "../_plugin-vue_export-helper-yVxbj29m.js";
-import "@nutui/icons-vue";
-import "../with-install-p59gYYU_.js";
-import "@nutui/nutui/dist/packages/locale/lang";
-import "../util-4Jkyw4BJ.js";
 const { create } = createComponent("signature");
 const cN = "NutSignature";
 const _sfc_main = create({

package/dist/packages/sku/Sku.js

@@ -3,13 +3,8 @@ import NutPrice from "../price/Price.js";
 import { c as createComponent } from "../component-TCzwHGVq.js";
 import { u as useLocale } from "../index-s3RgMhc7.js";
 import { _ as _export_sfc } from "../_plugin-vue_export-helper-yVxbj29m.js";
-import { T as TypeOfFun } from "../util-4Jkyw4BJ.js";
 import NutInputNumber from "../inputnumber/InputNumber.js";
 import { N as NutPopup } from "../index-wY4t0zYt.js";
-import "@nutui/nutui/dist/packages/locale/lang";
-import "../pxCheck-OnXlN1NC.js";
-import "@nutui/icons-vue";
-import "../overlay/Overlay.js";
 const { create: create$4 } = createComponent("sku-header");
 const cN$1 = "NutSkuHeader";
 const _sfc_main$4 = create$4({
@@ -158,10 +153,11 @@ const _sfc_main$2 = create$2({
     });
     const getExtraText = () => {
       const { stepperExtraText } = props;
-      if (stepperExtraText && TypeOfFun(stepperExtraText) == "function") {
-        return stepperExtraText();
-      } else {
-        return "";
+      if (stepperExtraText) {
+        if (stepperExtraText === true) {
+          return "";
+        }
+        return stepperExtraText == null ? void 0 : stepperExtraText();
       }
     };
     const add = (value) => {

package/dist/packages/sticky/Sticky.js

@@ -1,7 +1,7 @@
 import { ref, reactive, computed, watch, onMounted, onUnmounted, openBlock, createElementBlock, normalizeStyle, createElementVNode, renderSlot } from "vue";
 import { c as createComponent } from "../component-TCzwHGVq.js";
 import { g as getScrollParent } from "../index-xDfQLRen.js";
-import { u as useRect } from "../index-rf29bejW.js";
+import { u as useRect } from "../index-cp6Ms_Qe.js";
 import { _ as _export_sfc } from "../_plugin-vue_export-helper-yVxbj29m.js";
 const { create } = createComponent("sticky");
 const _sfc_main = create({

package/dist/packages/switch/Switch.js

@@ -1,6 +1,7 @@
-import { computed, watch, resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, renderSlot, createVNode, createCommentVNode, Fragment, withDirectives, toDisplayString, vShow } from "vue";
+import { toRef, computed, watch, resolveComponent, openBlock, createElementBlock, normalizeClass, normalizeStyle, createElementVNode, renderSlot, createVNode, createCommentVNode, Fragment, withDirectives, toDisplayString, vShow } from "vue";
 import { c as createComponent } from "../component-TCzwHGVq.js";
 import { Loading1 } from "@nutui/icons-vue";
+import { u as useFormDisabled } from "../common-LvGbU-A3.js";
 import { _ as _export_sfc } from "../_plugin-vue_export-helper-yVxbj29m.js";
 const { componentName, create } = createComponent("switch");
 const _sfc_main = create({
@@ -45,13 +46,14 @@ const _sfc_main = create({
   },
   emits: ["change", "update:modelValue", "update:loading"],
   setup(props, { emit }) {
+    const disabled = useFormDisabled(toRef(props, "disable"));
     const isActive = computed(() => props.modelValue === props.activeValue);
     const classes = computed(() => {
       const prefixCls = componentName;
       return {
         [prefixCls]: true,
         [isActive.value ? "nut-switch-open" : "nut-switch-close"]: true,
-        [`${prefixCls}-disable`]: props.disable,
+        [`${prefixCls}-disable`]: disabled.value,
         [`${prefixCls}-base`]: true
       };
     });
@@ -62,7 +64,7 @@ const _sfc_main = create({
     });
     let updateType = "";
     const onClick = (event) => {
-      if (props.disable || props.loading)
+      if (props.loading || disabled.value)
         return;
       const value = isActive.value ? props.inactiveValue : props.activeValue;
       updateType = "click";

package/dist/packages/table/Table.js

@@ -22,8 +22,6 @@ import { c as createComponent } from "../component-TCzwHGVq.js";
 import { DownArrow } from "@nutui/icons-vue";
 import { u as useLocale } from "../index-s3RgMhc7.js";
 import { _ as _export_sfc } from "../_plugin-vue_export-helper-yVxbj29m.js";
-import "@nutui/nutui/dist/packages/locale/lang";
-import "../util-4Jkyw4BJ.js";
 const RenderColumn = defineComponent({
   props: {
     slots: {