@nutui/nutui 3.3.2 → 3.3.3-beta.1

package/dist/packages/_es/ActionSheet.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.3.2 Wed Jan 04 2023 16:22:42 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.3.3-beta.1 Wed Jan 18 2023 09:13:06 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/_es/Address.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.3.2 Wed Jan 04 2023 16:22:42 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.3.3-beta.1 Wed Jan 18 2023 09:13:06 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/_es/AddressList.js

@@ -1,15 +1,15 @@
 /*!
-* @nutui/nutui v3.3.2 Wed Jan 04 2023 16:22:42 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.3.3-beta.1 Wed Jan 18 2023 09:13:06 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { resolveComponent, openBlock, createElementBlock, createElementVNode, renderSlot, toDisplayString, createCommentVNode, createVNode, createTextVNode, ref, createBlock, withCtx, reactive, computed, watch, onMounted, normalizeClass, Fragment, renderList, createSlots } from "vue";
+import { resolveComponent, openBlock, createElementBlock, createElementVNode, renderSlot, toDisplayString, createCommentVNode, createVNode, createTextVNode, ref, h, createBlock, resolveDynamicComponent, withCtx, reactive, computed, watch, onMounted, normalizeClass, Fragment, renderList, createSlots } from "vue";
 import { c as createComponent, n as floatData } from "./component.js";
 import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
 import "../locale/lang";
-const { create: create$3 } = createComponent("addresslist-item");
+const { create: create$2 } = createComponent("addresslist-item");
 const { translate: translate$1 } = createComponent("addresslist");
-const _sfc_main$3 = create$3({
+const _sfc_main$2 = create$2({
   props: {
     item: {
       type: Object,
@@ -38,7 +38,7 @@ const _sfc_main$3 = create$3({
     };
   }
 });
-const _hoisted_1$2 = { class: "nut-addresslist-item__info" };
+const _hoisted_1$1 = { class: "nut-addresslist-item__info" };
 const _hoisted_2$1 = { class: "nut-addresslist-item__info-contact" };
 const _hoisted_3$1 = { class: "nut-addresslist-item__info-contact-name" };
 const _hoisted_4$1 = { class: "nut-addresslist-item__info-contact-tel" };
@@ -48,13 +48,13 @@ const _hoisted_5$1 = {
 };
 const _hoisted_6$1 = { class: "nut-addresslist-item__info-handle" };
 const _hoisted_7$1 = { class: "nut-addresslist-item__addr" };
-function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
+function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_nut_icon = resolveComponent("nut-icon");
   return openBlock(), createElementBlock("div", {
     class: "nut-addresslist-item",
     onClick: _cache[0] || (_cache[0] = (...args) => _ctx.contentsClick && _ctx.contentsClick(...args))
   }, [
-    createElementVNode("div", _hoisted_1$2, [
+    createElementVNode("div", _hoisted_1$1, [
       createElementVNode("div", _hoisted_2$1, [
         renderSlot(_ctx.$slots, "contentTop", {}, () => [
           createElementVNode("div", _hoisted_3$1, toDisplayString(_ctx.item.addressName), 1),
@@ -84,103 +84,7 @@ function _sfc_render$3(_ctx, _cache, $props, $setup, $data, $options) {
     ])
   ]);
 }
-var ItemContents = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["render", _sfc_render$3]]);
-const { create: create$2 } = createComponent("addresslist-swipe");
-const _sfc_main$2 = create$2({
-  props: {
-    item: {
-      type: Object,
-      default: {}
-    }
-  },
-  emits: ["delIcon", "editIcon", "itemClick", "swipeDel"],
-  components: {
-    ItemContents
-  },
-  setup(props, { emit }) {
-    const moveRef = ref(false);
-    const delClick = (event) => {
-      emit("delIcon", event, props.item);
-      event.stopPropagation();
-    };
-    const editClick = (event) => {
-      emit("editIcon", event, props.item);
-      event.stopPropagation();
-    };
-    const itemClick = (event) => {
-      if (moveRef.value)
-        return;
-      emit("itemClick", event, props.item);
-      event.stopPropagation();
-    };
-    const swipeDelClick = (event) => {
-      emit("swipeDel", event, props.item);
-      event.stopPropagation();
-    };
-    const swipestart = () => {
-      moveRef.value = false;
-    };
-    const swipemove = () => {
-      moveRef.value = true;
-    };
-    return {
-      delClick,
-      editClick,
-      itemClick,
-      swipeDelClick,
-      swipestart,
-      swipemove
-    };
-  }
-});
-const _hoisted_1$1 = { class: "nut-addresslist-swipe" };
-function _sfc_render$2(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_item_contents = resolveComponent("item-contents");
-  const _component_nut_button = resolveComponent("nut-button");
-  const _component_nut_swipe = resolveComponent("nut-swipe");
-  return openBlock(), createBlock(_component_nut_swipe, null, {
-    right: withCtx(() => [
-      renderSlot(_ctx.$slots, "swiperightbtn", {}, () => [
-        createVNode(_component_nut_button, {
-          shape: "square",
-          style: { "height": "100%" },
-          type: "danger",
-          onClick: _ctx.swipeDelClick
-        }, {
-          default: withCtx(() => [
-            createTextVNode("\u5220\u9664")
-          ]),
-          _: 1
-        }, 8, ["onClick"])
-      ])
-    ]),
-    default: withCtx(() => [
-      createElementVNode("div", _hoisted_1$1, [
-        createVNode(_component_item_contents, {
-          item: _ctx.item,
-          onDelIcon: _ctx.delClick,
-          onEditIcon: _ctx.editClick,
-          onItemClick: _ctx.itemClick,
-          onTouchmove: _ctx.swipemove,
-          onTouchstart: _ctx.swipestart
-        }, {
-          contentTop: withCtx(() => [
-            renderSlot(_ctx.$slots, "contentInfo")
-          ]),
-          contentIcon: withCtx(() => [
-            renderSlot(_ctx.$slots, "contentIcons")
-          ]),
-          contentAddr: withCtx(() => [
-            renderSlot(_ctx.$slots, "contentAddrs")
-          ]),
-          _: 3
-        }, 8, ["item", "onDelIcon", "onEditIcon", "onItemClick", "onTouchmove", "onTouchstart"])
-      ])
-    ]),
-    _: 3
-  });
-}
-var SwipeShell = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2]]);
+var ItemContents = /* @__PURE__ */ _export_sfc(_sfc_main$2, [["render", _sfc_render$2]]);
 const { create: create$1 } = createComponent("addresslist-general");
 const _sfc_main$1 = create$1({
   props: {
@@ -191,27 +95,52 @@ const _sfc_main$1 = create$1({
     longPress: {
       type: Boolean,
       default: false
+    },
+    swipeEdition: {
+      type: Boolean,
+      default: false
     }
   },
-  emits: ["delIcon", "editIcon", "itemClick", "longDown", "longCopy", "longSet", "longDel"],
+  emits: ["delIcon", "editIcon", "itemClick", "longDown", "longCopy", "longSet", "longDel", "swipeDel"],
   components: {
     ItemContents
   },
   setup(props, { emit }) {
+    const renderCompontent = () => {
+      return h(ItemContents, {
+        item: props.item,
+        onDelIcon(event) {
+          delClick(event);
+        },
+        onEditIcon(event) {
+          editClick(event);
+        },
+        onItemClick(event) {
+          itemClick(event);
+        }
+      });
+    };
     let loop = null;
+    const moveRef = ref(false);
     const showMaskRef = ref(false);
-    const delShellClick = (event) => {
+    const delClick = (event) => {
       emit("delIcon", event, props.item);
       event.stopPropagation();
     };
-    const editShellClick = (event) => {
+    const editClick = (event) => {
       emit("editIcon", event, props.item);
       event.stopPropagation();
     };
-    const itemShellClick = (event) => {
+    const itemClick = (event) => {
+      if (moveRef.value)
+        return;
       emit("itemClick", event, props.item);
       event.stopPropagation();
     };
+    const delLongClick = (event) => {
+      emit("longDel", event, props.item);
+      event.stopPropagation();
+    };
     const holdingFunc = (event) => {
       loop = 0;
       showMaskRef.value = true;
@@ -239,10 +168,6 @@ const _sfc_main$1 = create$1({
       emit("longSet", event, props.item);
       event.stopPropagation();
     };
-    const delClick = (event) => {
-      emit("longDel", event, props.item);
-      event.stopPropagation();
-    };
     const maskClick = (event) => {
       if (loop != 0) {
         showMaskRef.value = false;
@@ -250,23 +175,40 @@ const _sfc_main$1 = create$1({
       event.stopPropagation();
       event.preventDefault();
     };
+    const swipeDelClick = (event) => {
+      emit("swipeDel", event, props.item);
+      event.stopPropagation();
+    };
+    const swipestart = () => {
+      moveRef.value = false;
+    };
+    const swipemove = () => {
+      moveRef.value = true;
+    };
     return {
-      delShellClick,
-      editShellClick,
-      itemShellClick,
+      renderCompontent,
+      showMaskRef,
+      itemClick,
+      editClick,
+      delClick,
+      delLongClick,
       holddownstart,
       holddownmove,
       holddownend,
-      showMaskRef,
-      delClick,
       copyCLick,
       hideMaskClick,
       setDefault,
-      maskClick
+      maskClick,
+      swipeDelClick,
+      swipestart,
+      swipemove
     };
   }
 });
-const _hoisted_1 = { class: "nut-addresslist-general" };
+const _hoisted_1 = {
+  key: 0,
+  class: "nut-addresslist-general"
+};
 const _hoisted_2 = /* @__PURE__ */ createElementVNode("div", { class: "nut-addresslist-mask-contain" }, [
   /* @__PURE__ */ createTextVNode(" \u590D\u5236"),
   /* @__PURE__ */ createElementVNode("br"),
@@ -291,14 +233,12 @@ const _hoisted_6 = /* @__PURE__ */ createElementVNode("div", { class: "nut-addre
 const _hoisted_7 = [
   _hoisted_6
 ];
+const _hoisted_8 = { class: "nut-addresslist-swipe" };
 function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
-  const _component_item_contents = resolveComponent("item-contents");
-  return openBlock(), createElementBlock("div", _hoisted_1, [
-    createVNode(_component_item_contents, {
-      item: _ctx.item,
-      onDelIcon: _ctx.delShellClick,
-      onEditIcon: _ctx.editShellClick,
-      onItemClick: _ctx.itemShellClick,
+  const _component_nut_button = resolveComponent("nut-button");
+  const _component_nut_swipe = resolveComponent("nut-swipe");
+  return !_ctx.swipeEdition ? (openBlock(), createElementBlock("div", _hoisted_1, [
+    (openBlock(), createBlock(resolveDynamicComponent(_ctx.renderCompontent()), {
       onTouchstart: _ctx.holddownstart,
       onTouchend: _ctx.holddownend,
       onTouchmove: _ctx.holddownmove
@@ -313,7 +253,7 @@ function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
         renderSlot(_ctx.$slots, "contentAddrs")
       ]),
       _: 3
-    }, 8, ["item", "onDelIcon", "onEditIcon", "onItemClick", "onTouchstart", "onTouchend", "onTouchmove"]),
+    }, 40, ["onTouchstart", "onTouchend", "onTouchmove"])),
     _ctx.longPress && _ctx.showMaskRef ? (openBlock(), createElementBlock("div", {
       key: 0,
       class: "nut-addresslist-general__mask",
@@ -330,7 +270,7 @@ function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
         }, _hoisted_5),
         createElementVNode("div", {
           class: "nut-addresslist-general__mask-del",
-          onClick: _cache[2] || (_cache[2] = (...args) => _ctx.delClick && _ctx.delClick(...args))
+          onClick: _cache[2] || (_cache[2] = (...args) => _ctx.delLongClick && _ctx.delLongClick(...args))
         }, _hoisted_7)
       ])
     ])) : createCommentVNode("", true),
@@ -339,7 +279,43 @@ function _sfc_render$1(_ctx, _cache, $props, $setup, $data, $options) {
       class: "nut-addresslist__mask-bottom",
       onClick: _cache[4] || (_cache[4] = (...args) => _ctx.hideMaskClick && _ctx.hideMaskClick(...args))
     })) : createCommentVNode("", true)
-  ]);
+  ])) : (openBlock(), createBlock(_component_nut_swipe, { key: 1 }, {
+    right: withCtx(() => [
+      renderSlot(_ctx.$slots, "swiperightbtn", {}, () => [
+        createVNode(_component_nut_button, {
+          shape: "square",
+          style: { "height": "100%" },
+          type: "danger",
+          onClick: _ctx.swipeDelClick
+        }, {
+          default: withCtx(() => [
+            createTextVNode("\u5220\u9664")
+          ]),
+          _: 1
+        }, 8, ["onClick"])
+      ])
+    ]),
+    default: withCtx(() => [
+      createElementVNode("div", _hoisted_8, [
+        (openBlock(), createBlock(resolveDynamicComponent(_ctx.renderCompontent()), {
+          onTouchmove: _ctx.swipemove,
+          onTouchstart: _ctx.swipestart
+        }, {
+          contentTop: withCtx(() => [
+            renderSlot(_ctx.$slots, "contentInfo")
+          ]),
+          contentIcon: withCtx(() => [
+            renderSlot(_ctx.$slots, "contentIcons")
+          ]),
+          contentAddr: withCtx(() => [
+            renderSlot(_ctx.$slots, "contentAddrs")
+          ]),
+          _: 3
+        }, 40, ["onTouchmove", "onTouchstart"]))
+      ])
+    ]),
+    _: 3
+  }));
 }
 var GeneralShell = /* @__PURE__ */ _export_sfc(_sfc_main$1, [["render", _sfc_render$1]]);
 const { componentName, create, translate } = createComponent("addresslist");
@@ -367,7 +343,6 @@ const _sfc_main = create({
     }
   },
   components: {
-    SwipeShell,
     GeneralShell
   },
   emits: ["delIcon", "editIcon", "itemClick", "longCopy", "longSet", "longDel", "swipeDel", "add"],
@@ -450,16 +425,16 @@ const _sfc_main = create({
 });
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_general_shell = resolveComponent("general-shell");
-  const _component_swipe_shell = resolveComponent("swipe-shell");
   const _component_nut_button = resolveComponent("nut-button");
   return openBlock(), createElementBlock("div", {
     class: normalizeClass(_ctx.classes)
   }, [
-    !_ctx.swipeEdition ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(_ctx.dataArray, (item, index2) => {
+    (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.dataArray, (item, index2) => {
       return openBlock(), createBlock(_component_general_shell, {
         key: index2,
         item,
         longPress: _ctx.longPress,
+        swipeEdition: _ctx.swipeEdition,
         onDelIcon: _ctx.clickDelIcon,
         onEditIcon: _ctx.clickEditIcon,
         onItemClick: _ctx.clickContentItem,
@@ -467,46 +442,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         onLongCopy: _ctx.clickLongCopy,
         onLongSet: _ctx.clickLongSet,
         onLongDel: _ctx.clickLongDel
-      }, createSlots({ _: 2 }, [
-        _ctx.longPress ? {
-          name: "contentInfo",
-          fn: withCtx(() => [
-            renderSlot(_ctx.$slots, "iteminfos")
-          ]),
-          key: "0"
-        } : void 0,
-        _ctx.longPress ? {
-          name: "contentIcons",
-          fn: withCtx(() => [
-            renderSlot(_ctx.$slots, "itemicon")
-          ]),
-          key: "1"
-        } : void 0,
-        _ctx.longPress ? {
-          name: "contentAddrs",
-          fn: withCtx(() => [
-            renderSlot(_ctx.$slots, "itemaddr")
-          ]),
-          key: "2"
-        } : void 0,
-        _ctx.longPress ? {
-          name: "longpressAll",
-          fn: withCtx(() => [
-            renderSlot(_ctx.$slots, "longpressbtns")
-          ]),
-          key: "3"
-        } : void 0
-      ]), 1032, ["item", "longPress", "onDelIcon", "onEditIcon", "onItemClick", "onSwipeDel", "onLongCopy", "onLongSet", "onLongDel"]);
-    }), 128)) : createCommentVNode("", true),
-    _ctx.swipeEdition ? (openBlock(true), createElementBlock(Fragment, { key: 1 }, renderList(_ctx.dataArray, (item, index2) => {
-      return openBlock(), createBlock(_component_swipe_shell, {
-        key: index2,
-        item,
-        onDelIcon: _ctx.clickDelIcon,
-        onEditIcon: _ctx.clickEditIcon,
-        onItemClick: _ctx.clickContentItem,
-        onSwipeDel: _ctx.clickSwipeDel
-      }, {
+      }, createSlots({
         contentInfo: withCtx(() => [
           renderSlot(_ctx.$slots, "iteminfos")
         ]),
@@ -516,14 +452,26 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
         contentAddrs: withCtx(() => [
           renderSlot(_ctx.$slots, "itemaddr")
         ]),
-        swiperightbtn: withCtx(() => [
-          renderSlot(_ctx.$slots, "swiperight")
-        ]),
         _: 2
-      }, 1032, ["item", "onDelIcon", "onEditIcon", "onItemClick", "onSwipeDel"]);
-    }), 128)) : createCommentVNode("", true),
+      }, [
+        _ctx.longPress ? {
+          name: "longpressAll",
+          fn: withCtx(() => [
+            renderSlot(_ctx.$slots, "longpressbtns")
+          ]),
+          key: "0"
+        } : void 0,
+        _ctx.swipeEdition ? {
+          name: "swiperightbtn",
+          fn: withCtx(() => [
+            renderSlot(_ctx.$slots, "swiperight")
+          ]),
+          key: "1"
+        } : void 0
+      ]), 1032, ["item", "longPress", "swipeEdition", "onDelIcon", "onEditIcon", "onItemClick", "onSwipeDel", "onLongCopy", "onLongSet", "onLongDel"]);
+    }), 128)),
     _ctx.showBottomButton ? (openBlock(), createElementBlock("div", {
-      key: 2,
+      key: 0,
       class: "nut-addresslist__bottom",
       onClick: _cache[0] || (_cache[0] = (...args) => _ctx.addAddress && _ctx.addAddress(...args))
     }, [

package/dist/packages/_es/Animate.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.3.2 Wed Jan 04 2023 16:22:42 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.3.3-beta.1 Wed Jan 18 2023 09:13:06 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/_es/Audio.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.3.2 Wed Jan 04 2023 16:22:42 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.3.3-beta.1 Wed Jan 18 2023 09:13:06 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/_es/AudioOperate.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.3.2 Wed Jan 04 2023 16:22:42 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.3.3-beta.1 Wed Jan 18 2023 09:13:06 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/_es/Avatar.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.3.2 Wed Jan 04 2023 16:22:42 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.3.3-beta.1 Wed Jan 18 2023 09:13:06 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/_es/AvatarGroup.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.3.2 Wed Jan 04 2023 16:22:42 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.3.3-beta.1 Wed Jan 18 2023 09:13:06 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/_es/BackTop.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.3.2 Wed Jan 04 2023 16:22:42 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.3.3-beta.1 Wed Jan 18 2023 09:13:06 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/_es/Badge.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui v3.3.2 Wed Jan 04 2023 16:22:42 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.3.3-beta.1 Wed Jan 18 2023 09:13:06 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/packages/_es/Barrage.js

@@ -1,9 +1,9 @@
 /*!
-* @nutui/nutui v3.3.2 Wed Jan 04 2023 16:22:42 GMT+0800 (中国标准时间)
+* @nutui/nutui v3.3.3-beta.1 Wed Jan 18 2023 09:13:06 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
-import { useSlots, computed, ref, onMounted, onUnmounted, onDeactivated, watch, nextTick, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, createCommentVNode } from "vue";
+import { useSlots, computed, ref, onMounted, onUnmounted, watch, nextTick, openBlock, createElementBlock, normalizeClass, createElementVNode, renderSlot, createCommentVNode } from "vue";
 import { c as createComponent } from "./component.js";
 import { _ as _export_sfc } from "./plugin-vue_export-helper.js";
 import "../locale/lang";
@@ -36,8 +36,7 @@ const _sfc_main = create({
       default: true
     }
   },
-  emits: ["click"],
-  setup(props, { slots }) {
+  setup(props) {
     const classTime = new Date().getTime();
     const slotDefault = !!useSlots().default;
     const classes = computed(() => {
@@ -56,36 +55,58 @@ const _sfc_main = create({
     const speeds = props.speeds;
     const danmuCWidth = ref(0);
     onMounted(() => {
-      var _a;
-      danmuCWidth.value = dmBody.value.offsetWidth;
+      init();
       if (slotDefault) {
-        const list = document.getElementsByClassName("slotBody" + classTime);
-        let childrens = ((_a = list == null ? void 0 : list[0]) == null ? void 0 : _a.children) || [];
-        const dmList = [];
-        if (childrens) {
-          Array.from(childrens).forEach((item) => {
-            item.style.opacity = "0";
-            dmList.push(item);
-          });
-        }
-        danmuList.value = dmList;
+        document.addEventListener("visibilitychange", function() {
+          if (document.visibilityState === "hidden") {
+            clearTime();
+            index2.value = 0;
+            eleSlot("hidden");
+          } else if (document.visibilityState === "visible") {
+            init();
+          }
+        });
       }
-      setTimeout(() => {
-        var _a2;
-        (_a2 = dmBody.value) == null ? void 0 : _a2.style.setProperty("--move-distance", `-${danmuCWidth.value}px`);
-        run();
-      }, 300);
     });
     onUnmounted(() => {
       danmuList.value = [];
-      clearInterval(timer);
-      timer = 0;
+      clearTime();
     });
-    onDeactivated(() => {
-      danmuList.value = [];
-      clearInterval(timer);
+    const init = () => {
+      danmuCWidth.value = dmBody.value.offsetWidth;
+      if (slotDefault) {
+        eleSlot("init");
+      }
+      setTimeout(() => {
+        var _a;
+        (_a = dmBody.value) == null ? void 0 : _a.style.setProperty("--move-distance", `-${danmuCWidth.value}px`);
+        run();
+      }, 300);
+    };
+    const eleSlot = (flag) => {
+      var _a;
+      const list = document.getElementsByClassName("slotBody" + classTime);
+      let childrens = ((_a = list == null ? void 0 : list[0]) == null ? void 0 : _a.children) || [];
+      const dmList = [];
+      if (childrens) {
+        Array.from(childrens).forEach((item) => {
+          if (flag == "init") {
+            item.style.opacity = "0";
+            dmList.push(item);
+          } else {
+            item.classList = "";
+            item.style = {};
+          }
+        });
+      }
+      if (flag == "init") {
+        danmuList.value = dmList;
+      }
+    };
+    const clearTime = () => {
+      clearTimeout(timer);
       timer = 0;
-    });
+    };
     watch(
       () => props.danmu,
       (newValue) => {
@@ -103,11 +124,9 @@ const _sfc_main = create({
       }
     };
     const run = () => {
-      clearInterval(timer);
-      timer = 0;
+      clearTime();
       timer = setTimeout(() => {
         play();
-        run();
       }, props.frequency);
     };
     const play = () => {
@@ -136,21 +155,20 @@ const _sfc_main = create({
           const width = el.offsetWidth;
           el.style.width = width + 20 + "px";
         }
-        el.dataset.index = `${_index}`;
-        if (slotDefault) {
-          index2.value++;
-          el.addEventListener("animationend", () => {
-            var _a3;
-            if ((_a3 = el == null ? void 0 : el.classList) == null ? void 0 : _a3.contains("move")) {
-              el.classList.remove("move");
-            }
-          });
-        } else {
-          el.addEventListener("animationend", () => {
+        el.addEventListener("animationend", () => {
+          if (slotDefault) {
+            el.classList.remove("move");
+          } else {
             dmContainer.value.removeChild(el);
-          });
-          index2.value++;
+          }
+        });
+        index2.value++;
+        if (index2.value >= danmuList.value.length) {
+          index2.value = 0;
         }
+        el.removeEventListener("animationend", () => {
+        });
+        run();
       });
     };
     return { classTime, classes, danmuList, dmBody, dmContainer, add };