vxe-pc-ui 4.20.24 → 4.20.26

package/lib/carousel/src/carousel.js

@@ -33,11 +33,12 @@ __export(carousel_exports, {
 module.exports = __toCommonJS(carousel_exports);
 var import_vue = require("vue");
 var import_comp = require("../../ui/src/comp");
-var import_ui = require("../../ui");
+var import_core = require("@vxe-ui/core");
 var import_vn = require("../../ui/src/vn");
 var import_dom = require("../../ui/src/dom");
 var import_loading = __toESM(require("../../loading"));
 var import_xe_utils = __toESM(require("xe-utils"));
+const { getConfig, getIcon, createEvent, renderEmptyElement } = import_core.VxeUI;
 var carousel_default = (0, import_comp.defineVxeComponent)({
   name: "VxeCarousel",
   props: {
@@ -46,37 +47,34 @@ var carousel_default = (0, import_comp.defineVxeComponent)({
     loading: Boolean,
     height: {
       type: [Number, String],
-      default: () => (0, import_ui.getConfig)().carousel.height
+      default: () => getConfig().carousel.height
     },
     width: {
       type: [Number, String],
-      default: () => (0, import_ui.getConfig)().carousel.width
+      default: () => getConfig().carousel.width
     },
     autoPlay: {
       type: Boolean,
-      default: () => (0, import_ui.getConfig)().carousel.autoPlay
+      default: () => getConfig().carousel.autoPlay
     },
     interval: {
       type: [Number, String],
-      default: () => (0, import_ui.getConfig)().carousel.interval
+      default: () => getConfig().carousel.interval
     },
     loop: {
       type: Boolean,
-      default: () => (0, import_ui.getConfig)().carousel.loop
+      default: () => getConfig().carousel.loop
     },
     vertical: {
       type: Boolean,
-      default: () => (0, import_ui.getConfig)().carousel.vertical
+      default: () => getConfig().carousel.vertical
     },
     showIndicators: {
       type: Boolean,
-      default: () => (0, import_ui.getConfig)().carousel.showIndicators
+      default: () => getConfig().carousel.showIndicators
     }
   },
-  emits: [
-    "update:modelValue",
-    "change"
-  ],
+  emits: ["update:modelValue", "change"],
   setup(props, context) {
     const { emit, slots } = context;
     const xID = import_xe_utils.default.uniqueId();
@@ -99,7 +97,10 @@ var carousel_default = (0, import_comp.defineVxeComponent)({
       const { vertical, options } = props;
       const { activeName, itemWidth, itemHeight, staticItems } = reactData;
       const list = (staticItems && staticItems.length ? staticItems : options) || [];
-      const activeIndex = Math.max(0, import_xe_utils.default.findIndexOf(list, (item) => item.name === activeName));
+      const activeIndex = Math.max(
+        0,
+        import_xe_utils.default.findIndexOf(list, (item) => item.name === activeName)
+      );
       const stys = {};
       if (vertical) {
         stys.transform = `translateY(-${activeIndex * itemHeight}px)`;
@@ -153,13 +154,16 @@ var carousel_default = (0, import_comp.defineVxeComponent)({
       reactData.activeName = activeName;
     };
     const dispatchEvent = (type, params, evnt) => {
-      emit(type, (0, import_ui.createEvent)(evnt, { $carousel: $xeCarousel }, params));
+      emit(type, createEvent(evnt, { $carousel: $xeCarousel }, params));
     };
     const handlePrevNext = (isNext) => {
       const { options, loop } = props;
       const { activeName, staticItems } = reactData;
       const list = (staticItems && staticItems.length ? staticItems : options) || [];
-      const index = Math.max(0, import_xe_utils.default.findIndexOf(list, (item) => item.name === activeName));
+      const index = Math.max(
+        0,
+        import_xe_utils.default.findIndexOf(list, (item) => item.name === activeName)
+      );
       if (index > -1) {
         let item = null;
         if (isNext) {
@@ -230,11 +234,14 @@ var carousel_default = (0, import_comp.defineVxeComponent)({
       stopAutoPlay();
       if (autoPlay) {
         internalData.stopFlag = false;
-        internalData.apTimeout = setTimeout(() => {
-          if (!stopFlag) {
-            handlePrevNext(true);
-          }
-        }, import_xe_utils.default.toNumber(interval) || 300);
+        internalData.apTimeout = setTimeout(
+          () => {
+            if (!stopFlag) {
+              handlePrevNext(true);
+            }
+          },
+          import_xe_utils.default.toNumber(interval) || 300
+        );
       }
     };
     const mouseenterEvent = () => {
@@ -260,124 +267,179 @@ var carousel_default = (0, import_comp.defineVxeComponent)({
       const { height } = props;
       const { activeName } = reactData;
       const listStyle = computeListStyle.value;
-      return (0, import_vue.h)("div", {
-        class: "vxe-carousel--list",
-        style: listStyle
-      }, list.map((item) => {
-        const { name, url, slots: slots2 } = item;
-        const defaultSlot = slots2 ? slots2.default : null;
-        return (0, import_vue.h)("div", {
-          key: `${name}`,
-          class: ["vxe-carousel--item-inner", {
-            "is--active": activeName === name
-          }],
-          style: height ? {
-            height: (0, import_dom.toCssUnit)(height)
-          } : null
-        }, defaultSlot ? callSlot(defaultSlot, {}) : [
-          (0, import_vue.h)("img", {
-            class: "vxe-carousel--item-img",
-            src: url
-          })
-        ]);
-      }));
+      return (0, import_vue.h)(
+        "div",
+        {
+          class: "vxe-carousel--list",
+          style: listStyle
+        },
+        list.map((item) => {
+          const { name, url, slots: slots2 } = item;
+          const defaultSlot = slots2 ? slots2.default : null;
+          return (0, import_vue.h)(
+            "div",
+            {
+              key: `${name}`,
+              class: [
+                "vxe-carousel--item-inner",
+                {
+                  "is--active": activeName === name
+                }
+              ],
+              style: height ? {
+                height: (0, import_dom.toCssUnit)(height)
+              } : null
+            },
+            defaultSlot ? callSlot(defaultSlot, {}) : [
+              (0, import_vue.h)("img", {
+                class: "vxe-carousel--item-img",
+                src: url
+              })
+            ]
+          );
+        })
+      );
     };
     const renderIndicators = (list) => {
       const { activeName } = reactData;
-      return (0, import_vue.h)("div", {
-        class: "vxe-carousel--indicators"
-      }, list.map((item) => {
-        const { name } = item;
-        return (0, import_vue.h)("div", {
-          key: `${name}`,
-          class: ["vxe-carousel--indicators-item", {
-            "is--active": activeName === name
-          }],
-          onClick(evnt) {
-            clickItemEvent(evnt, item);
-          }
-        });
-      }));
+      return (0, import_vue.h)(
+        "div",
+        {
+          class: "vxe-carousel--indicators"
+        },
+        list.map((item) => {
+          const { name } = item;
+          return (0, import_vue.h)("div", {
+            key: `${name}`,
+            class: [
+              "vxe-carousel--indicators-item",
+              {
+                "is--active": activeName === name
+              }
+            ],
+            onClick(evnt) {
+              clickItemEvent(evnt, item);
+            }
+          });
+        })
+      );
     };
     const renderVN = () => {
       const { loading, height, width, showIndicators, vertical, options } = props;
       const { staticItems } = reactData;
       const defaultSlot = slots.default;
       const list = (staticItems && staticItems.length ? staticItems : options) || [];
-      return (0, import_vue.h)("div", {
-        ref: refElem,
-        class: ["vxe-carousel", `is--${vertical ? "vertical" : "horizontal"}`],
-        style: width ? {
-          width: (0, import_dom.toCssUnit)(width)
-        } : null,
-        onMouseenter: mouseenterEvent,
-        onMouseleave: mouseleaveEvent
-      }, [
-        (0, import_vue.h)("div", {
-          class: "vxe-carousel--slots"
-        }, defaultSlot ? defaultSlot({}) : []),
-        (0, import_vue.h)("div", {
-          ref: refWrapperElem,
-          class: "vxe-carousel--item-wrapper",
-          style: height ? {
-            height: (0, import_dom.toCssUnit)(height)
-          } : null
-        }, [
-          renderItemWrapper(list)
-        ]),
-        showIndicators ? renderIndicators(list) : (0, import_ui.renderEmptyElement)($xeCarousel),
-        (0, import_vue.h)("div", {
-          class: "vxe-carousel--btn-wrapper"
-        }, [
-          (0, import_vue.h)("div", {
-            class: "vxe-carousel--previous-btn",
-            onClick: prevEvent
-          }, [
-            (0, import_vue.h)("i", {
-              class: vertical ? (0, import_ui.getIcon)().CAROUSEL_VERTICAL_PREVIOUS : (0, import_ui.getIcon)().CAROUSEL_HORIZONTAL_PREVIOUS
-            })
-          ]),
-          (0, import_vue.h)("div", {
-            class: "vxe-carousel--next-btn",
-            onClick: nextEvent
-          }, [
-            (0, import_vue.h)("i", {
-              class: vertical ? (0, import_ui.getIcon)().CAROUSEL_VERTICAL_NEXT : (0, import_ui.getIcon)().CAROUSEL_HORIZONTAL_NEXT
-            })
-          ])
-        ]),
-        /**
-         * 加载中
-         */
-        (0, import_vue.h)(import_loading.default, {
-          class: "vxe-carousel--loading",
-          modelValue: loading
-        })
-      ]);
+      return (0, import_vue.h)(
+        "div",
+        {
+          ref: refElem,
+          class: ["vxe-carousel", `is--${vertical ? "vertical" : "horizontal"}`],
+          style: width ? {
+            width: (0, import_dom.toCssUnit)(width)
+          } : null,
+          onMouseenter: mouseenterEvent,
+          onMouseleave: mouseleaveEvent
+        },
+        [
+          (0, import_vue.h)(
+            "div",
+            {
+              class: "vxe-carousel--slots"
+            },
+            defaultSlot ? defaultSlot({}) : []
+          ),
+          (0, import_vue.h)(
+            "div",
+            {
+              ref: refWrapperElem,
+              class: "vxe-carousel--item-wrapper",
+              style: height ? {
+                height: (0, import_dom.toCssUnit)(height)
+              } : null
+            },
+            [renderItemWrapper(list)]
+          ),
+          showIndicators ? renderIndicators(list) : renderEmptyElement($xeCarousel),
+          (0, import_vue.h)(
+            "div",
+            {
+              class: "vxe-carousel--btn-wrapper"
+            },
+            [
+              (0, import_vue.h)(
+                "div",
+                {
+                  class: "vxe-carousel--previous-btn",
+                  onClick: prevEvent
+                },
+                [
+                  (0, import_vue.h)("i", {
+                    class: vertical ? getIcon().CAROUSEL_VERTICAL_PREVIOUS : getIcon().CAROUSEL_HORIZONTAL_PREVIOUS
+                  })
+                ]
+              ),
+              (0, import_vue.h)(
+                "div",
+                {
+                  class: "vxe-carousel--next-btn",
+                  onClick: nextEvent
+                },
+                [
+                  (0, import_vue.h)("i", {
+                    class: vertical ? getIcon().CAROUSEL_VERTICAL_NEXT : getIcon().CAROUSEL_HORIZONTAL_NEXT
+                  })
+                ]
+              )
+            ]
+          ),
+          /**
+           * 加载中
+           */
+          (0, import_vue.h)(import_loading.default, {
+            class: "vxe-carousel--loading",
+            modelValue: loading
+          })
+        ]
+      );
     };
     const optsFlag = (0, import_vue.ref)(0);
-    (0, import_vue.watch)(() => props.options ? props.options.length : -1, () => {
-      optsFlag.value++;
-    });
-    (0, import_vue.watch)(() => props.options, () => {
-      optsFlag.value++;
-    });
+    (0, import_vue.watch)(
+      () => props.options ? props.options.length : -1,
+      () => {
+        optsFlag.value++;
+      }
+    );
+    (0, import_vue.watch)(
+      () => props.options,
+      () => {
+        optsFlag.value++;
+      }
+    );
     (0, import_vue.watch)(optsFlag, () => {
       initDefaultActive(props.options);
     });
     const stFlag = (0, import_vue.ref)(0);
-    (0, import_vue.watch)(() => reactData.staticItems ? reactData.staticItems.length : -1, () => {
-      stFlag.value++;
-    });
-    (0, import_vue.watch)(() => reactData.staticItems, () => {
-      stFlag.value++;
-    });
+    (0, import_vue.watch)(
+      () => reactData.staticItems ? reactData.staticItems.length : -1,
+      () => {
+        stFlag.value++;
+      }
+    );
+    (0, import_vue.watch)(
+      () => reactData.staticItems,
+      () => {
+        stFlag.value++;
+      }
+    );
     (0, import_vue.watch)(stFlag, () => {
       initDefaultActive(reactData.staticItems);
     });
-    (0, import_vue.watch)(() => props.autoPlay, () => {
-      handleAutoPlay();
-    });
+    (0, import_vue.watch)(
+      () => props.autoPlay,
+      () => {
+        handleAutoPlay();
+      }
+    );
     initDefaultActive(reactData.staticItems.length ? reactData.staticItems : props.options);
     (0, import_vue.onMounted)(() => {
       handleAutoPlay();