vxe-pc-ui 3.16.0 → 3.16.1

package/lib/card/style/style.css

@@ -0,0 +1,107 @@
+.vxe-card {
+  position: relative;
+  display: inline-flex;
+  flex-direction: column;
+  font-size: var(--vxe-ui-font-size-default);
+  color: var(--vxe-ui-font-color);
+  font-family: var(--vxe-ui-font-family);
+  background-color: var(--vxe-ui-layout-background-color);
+  border-radius: var(--vxe-ui-base-border-radius);
+}
+.vxe-card.is--shadow {
+  box-shadow: var(--vxe-ui-base-popup-box-shadow);
+}
+.vxe-card.is--border {
+  border: 1px solid var(--vxe-ui-input-border-color);
+}
+.vxe-card.is--border .vxe-card--header {
+  border-bottom: 1px solid var(--vxe-ui-input-border-color);
+}
+.vxe-card.is--border .vxe-card--footer {
+  border-top: 1px solid var(--vxe-ui-input-border-color);
+}
+
+.vxe-card--header,
+.vxe-card--body {
+  display: flex;
+  flex-direction: row;
+}
+
+.vxe-card--header {
+  flex-shrink: 0;
+}
+
+.vxe-card--body {
+  overflow: hidden;
+  flex-grow: 1;
+}
+
+.vxe-card--body-left,
+.vxe-card--body-right,
+.vxe-card--body-content {
+  overflow: auto;
+}
+
+.vxe-card--header,
+.vxe-card--header-extra,
+.vxe-card--footer,
+.vxe-card--body-left,
+.vxe-card--body-right {
+  flex-shrink: 0;
+}
+
+.vxe-card--header-title,
+.vxe-card--body-content {
+  flex-grow: 1;
+}
+
+.vxe-card--header-title.is--ellipsis {
+  overflow: hidden;
+  text-overflow: ellipsis;
+  white-space: nowrap;
+}
+
+.vxe-card {
+  font-size: var(--vxe-ui-font-size-default);
+}
+.vxe-card > .vxe-card--header, .vxe-card > .vxe-card--footer {
+  padding: var(--vxe-ui-card-padding-default);
+}
+.vxe-card.is--padding > .vxe-card--body .vxe-card--body-content,
+.vxe-card.is--padding > .vxe-card--body .vxe-card--body-left,
+.vxe-card.is--padding > .vxe-card--body .vxe-card--body-right {
+  padding: var(--vxe-ui-card-padding-default);
+}
+.vxe-card.size--medium {
+  font-size: var(--vxe-ui-font-size-medium);
+}
+.vxe-card.size--medium > .vxe-card--header, .vxe-card.size--medium > .vxe-card--footer {
+  padding: var(--vxe-ui-card-padding-medium);
+}
+.vxe-card.size--medium.is--padding > .vxe-card--body .vxe-card--body-content,
+.vxe-card.size--medium.is--padding > .vxe-card--body .vxe-card--body-left,
+.vxe-card.size--medium.is--padding > .vxe-card--body .vxe-card--body-right {
+  padding: var(--vxe-ui-card-padding-medium);
+}
+.vxe-card.size--small {
+  font-size: var(--vxe-ui-font-size-small);
+}
+.vxe-card.size--small > .vxe-card--header, .vxe-card.size--small > .vxe-card--footer {
+  padding: var(--vxe-ui-card-padding-small);
+}
+.vxe-card.size--small.is--padding > .vxe-card--body .vxe-card--body-content,
+.vxe-card.size--small.is--padding > .vxe-card--body .vxe-card--body-left,
+.vxe-card.size--small.is--padding > .vxe-card--body .vxe-card--body-right {
+  padding: var(--vxe-ui-card-padding-small);
+}
+.vxe-card.size--mini {
+  font-size: var(--vxe-ui-font-size-mini);
+}
+.vxe-card.size--mini > .vxe-card--header, .vxe-card.size--mini > .vxe-card--footer {
+  padding: var(--vxe-ui-card-padding-mini);
+}
+.vxe-card.size--mini.is--padding > .vxe-card--body .vxe-card--body-content,
+.vxe-card.size--mini.is--padding > .vxe-card--body .vxe-card--body-left,
+.vxe-card.size--mini.is--padding > .vxe-card--body .vxe-card--body-right {
+  padding: var(--vxe-ui-card-padding-mini);
+}

package/lib/card/style/style.min.css

@@ -0,0 +1 @@
+.vxe-card{position:relative;display:inline-flex;flex-direction:column;font-size:var(--vxe-ui-font-size-default);color:var(--vxe-ui-font-color);font-family:var(--vxe-ui-font-family);background-color:var(--vxe-ui-layout-background-color);border-radius:var(--vxe-ui-base-border-radius)}.vxe-card.is--shadow{box-shadow:var(--vxe-ui-base-popup-box-shadow)}.vxe-card.is--border{border:1px solid var(--vxe-ui-input-border-color)}.vxe-card.is--border .vxe-card--header{border-bottom:1px solid var(--vxe-ui-input-border-color)}.vxe-card.is--border .vxe-card--footer{border-top:1px solid var(--vxe-ui-input-border-color)}.vxe-card--body,.vxe-card--header{display:flex;flex-direction:row}.vxe-card--header{flex-shrink:0}.vxe-card--body{overflow:hidden;flex-grow:1}.vxe-card--body-content,.vxe-card--body-left,.vxe-card--body-right{overflow:auto}.vxe-card--body-left,.vxe-card--body-right,.vxe-card--footer,.vxe-card--header,.vxe-card--header-extra{flex-shrink:0}.vxe-card--body-content,.vxe-card--header-title{flex-grow:1}.vxe-card--header-title.is--ellipsis{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.vxe-card{font-size:var(--vxe-ui-font-size-default)}.vxe-card>.vxe-card--footer,.vxe-card>.vxe-card--header{padding:var(--vxe-ui-card-padding-default)}.vxe-card.is--padding>.vxe-card--body .vxe-card--body-content,.vxe-card.is--padding>.vxe-card--body .vxe-card--body-left,.vxe-card.is--padding>.vxe-card--body .vxe-card--body-right{padding:var(--vxe-ui-card-padding-default)}.vxe-card.size--medium{font-size:var(--vxe-ui-font-size-medium)}.vxe-card.size--medium>.vxe-card--footer,.vxe-card.size--medium>.vxe-card--header{padding:var(--vxe-ui-card-padding-medium)}.vxe-card.size--medium.is--padding>.vxe-card--body .vxe-card--body-content,.vxe-card.size--medium.is--padding>.vxe-card--body .vxe-card--body-left,.vxe-card.size--medium.is--padding>.vxe-card--body .vxe-card--body-right{padding:var(--vxe-ui-card-padding-medium)}.vxe-card.size--small{font-size:var(--vxe-ui-font-size-small)}.vxe-card.size--small>.vxe-card--footer,.vxe-card.size--small>.vxe-card--header{padding:var(--vxe-ui-card-padding-small)}.vxe-card.size--small.is--padding>.vxe-card--body .vxe-card--body-content,.vxe-card.size--small.is--padding>.vxe-card--body .vxe-card--body-left,.vxe-card.size--small.is--padding>.vxe-card--body .vxe-card--body-right{padding:var(--vxe-ui-card-padding-small)}.vxe-card.size--mini{font-size:var(--vxe-ui-font-size-mini)}.vxe-card.size--mini>.vxe-card--footer,.vxe-card.size--mini>.vxe-card--header{padding:var(--vxe-ui-card-padding-mini)}.vxe-card.size--mini.is--padding>.vxe-card--body .vxe-card--body-content,.vxe-card.size--mini.is--padding>.vxe-card--body .vxe-card--body-left,.vxe-card.size--mini.is--padding>.vxe-card--body .vxe-card--body-right{padding:var(--vxe-ui-card-padding-mini)}

package/lib/carousel/index.js

@@ -0,0 +1,19 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.VxeCarousel = exports.Carousel = void 0;
+var _core = require("@vxe-ui/core");
+var _carousel = _interopRequireDefault(require("./src/carousel"));
+var _dynamics = require("../dynamics");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var VxeCarousel = exports.VxeCarousel = Object.assign({}, _carousel.default, {
+  install: function install(app) {
+    app.component(_carousel.default.name, _carousel.default);
+  }
+});
+_dynamics.dynamicApp.use(VxeCarousel);
+_core.VxeUI.component(_carousel.default);
+var Carousel = exports.Carousel = VxeCarousel;
+var _default = exports.default = VxeCarousel;

package/lib/carousel/index.min.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=exports.VxeCarousel=exports.Carousel=void 0;var _core=require("@vxe-ui/core"),_carousel=_interopRequireDefault(require("./src/carousel")),_dynamics=require("../dynamics");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var VxeCarousel=exports.VxeCarousel=Object.assign({},_carousel.default,{install:function(e){e.component(_carousel.default.name,_carousel.default)}}),Carousel=(_dynamics.dynamicApp.use(VxeCarousel),_core.VxeUI.component(_carousel.default),exports.Carousel=VxeCarousel),_default=exports.default=VxeCarousel;

package/lib/carousel/src/carousel-item.js

@@ -0,0 +1,110 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _comp = require("../../ui/src/comp");
+var _xeUtils = _interopRequireDefault(require("xe-utils"));
+var _ui = require("../../ui");
+var _util = require("./util");
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default = exports.default = /* define-vxe-component start */(0, _comp.defineVxeComponent)({
+  name: 'VxeCarouselItem',
+  mixins: [_ui.globalMixins.sizeMixin],
+  props: {
+    name: [String, Number],
+    className: String,
+    url: String
+  },
+  inject: {
+    $xeCarousel: {
+      default: null
+    }
+  },
+  data: function data() {
+    var xID = _xeUtils.default.uniqueId();
+    var reactData = {
+      currentDate: null
+    };
+    var itemConfig = {
+      id: xID,
+      name: '',
+      url: '',
+      className: '',
+      slots: {}
+    };
+    return {
+      xID: xID,
+      reactData: reactData,
+      itemConfig: itemConfig
+    };
+  },
+  computed: Object.assign({}, {}),
+  methods: {
+    //
+    // Method
+    //
+    dispatchEvent: function dispatchEvent(type, params, evnt) {
+      var $xeCarouselItem = this;
+      $xeCarouselItem.$emit(type, (0, _ui.createEvent)(evnt, {
+        $carouselItem: $xeCarouselItem
+      }, params));
+    },
+    //
+    // Render
+    //
+    renderVN: function renderVN(h) {
+      return h('div', {
+        ref: 'refElem'
+      });
+    }
+  },
+  watch: {
+    name: function name(val) {
+      var $xeCarouselItem = this;
+      var itemConfig = $xeCarouselItem.itemConfig;
+      itemConfig.name = val;
+    },
+    url: function url(val) {
+      var $xeCarouselItem = this;
+      var itemConfig = $xeCarouselItem.itemConfig;
+      itemConfig.url = val;
+    }
+  },
+  created: function created() {
+    var $xeCarouselItem = this;
+    var props = $xeCarouselItem;
+    var slots = $xeCarouselItem.$scopedSlots;
+    var itemConfig = $xeCarouselItem.itemConfig;
+    Object.assign(itemConfig, {
+      name: props.name,
+      url: props.url,
+      className: props.className,
+      slots: slots
+    });
+  },
+  mounted: function mounted() {
+    var $xeCarouselItem = this;
+    var slots = $xeCarouselItem.$scopedSlots;
+    var itemConfig = $xeCarouselItem.itemConfig;
+    var $xeCarousel = $xeCarouselItem.$xeCarousel;
+    itemConfig.slots = slots;
+    var elem = $xeCarouselItem.$refs.refElem;
+    if ($xeCarousel && elem) {
+      (0, _util.assembleCarouselItem)($xeCarousel, elem, itemConfig);
+    }
+  },
+  beforeDestroy: function beforeDestroy() {
+    var $xeCarouselItem = this;
+    var itemConfig = $xeCarouselItem.itemConfig;
+    var $xeCarousel = $xeCarouselItem.$xeCarousel;
+    if ($xeCarousel) {
+      (0, _util.destroyCarouselItem)($xeCarousel, itemConfig);
+    }
+  },
+  render: function render(h) {
+    return this.renderVN(h);
+  }
+});
+/* define-vxe-component end */

package/lib/carousel/src/carousel-item.min.js

@@ -0,0 +1 @@
+Object.defineProperty(exports,"__esModule",{value:!0}),exports.default=void 0;var _comp=require("../../ui/src/comp"),_xeUtils=_interopRequireDefault(require("xe-utils")),_ui=require("../../ui"),_util=require("./util");function _interopRequireDefault(e){return e&&e.__esModule?e:{default:e}}var _default=exports.default=(0,_comp.defineVxeComponent)({name:"VxeCarouselItem",mixins:[_ui.globalMixins.sizeMixin],props:{name:[String,Number],className:String,url:String},inject:{$xeCarousel:{default:null}},data:function(){var e=_xeUtils.default.uniqueId();return{xID:e,reactData:{currentDate:null},itemConfig:{id:e,name:"",url:"",className:"",slots:{}}}},computed:Object.assign({},{}),methods:{dispatchEvent:function(e,t,i){this.$emit(e,(0,_ui.createEvent)(i,{$carouselItem:this},t))},renderVN:function(e){return e("div",{ref:"refElem"})}},watch:{name:function(e){this.itemConfig.name=e},url:function(e){this.itemConfig.url=e}},created:function(){var e=this,t=e.$scopedSlots;Object.assign(e.itemConfig,{name:e.name,url:e.url,className:e.className,slots:t})},mounted:function(){var e=this,t=e.$scopedSlots,i=e.itemConfig,r=e.$xeCarousel,t=(i.slots=t,e.$refs.refElem);r&&t&&(0,_util.assembleCarouselItem)(r,t,i)},beforeDestroy:function(){var e=this.itemConfig,t=this.$xeCarousel;t&&(0,_util.destroyCarouselItem)(t,e)},render:function(e){return this.renderVN(e)}});

package/lib/carousel/src/carousel.js

@@ -0,0 +1,448 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+var _comp = require("../../ui/src/comp");
+var _xeUtils = _interopRequireDefault(require("xe-utils"));
+var _ui = require("../../ui");
+var _vn = require("../../ui/src/vn");
+var _dom = require("../../ui/src/dom");
+var _loading = _interopRequireDefault(require("../../loading/src/loading"));
+function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
+var _default2 = exports.default = /* define-vxe-component start */(0, _comp.defineVxeComponent)({
+  name: 'VxeCarousel',
+  mixins: [_ui.globalMixins.sizeMixin],
+  props: {
+    value: [String, Number],
+    options: Array,
+    loading: Boolean,
+    height: {
+      type: [Number, String],
+      default: function _default() {
+        return (0, _ui.getConfig)().carousel.height;
+      }
+    },
+    width: {
+      type: [Number, String],
+      default: function _default() {
+        return (0, _ui.getConfig)().carousel.width;
+      }
+    },
+    autoPlay: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().carousel.autoPlay;
+      }
+    },
+    interval: {
+      type: [Number, String],
+      default: function _default() {
+        return (0, _ui.getConfig)().carousel.interval;
+      }
+    },
+    loop: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().carousel.loop;
+      }
+    },
+    vertical: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().carousel.vertical;
+      }
+    },
+    showIndicators: {
+      type: Boolean,
+      default: function _default() {
+        return (0, _ui.getConfig)().carousel.showIndicators;
+      }
+    }
+  },
+  data: function data() {
+    var xID = _xeUtils.default.uniqueId();
+    var reactData = {
+      activeName: '',
+      staticItems: [],
+      itemWidth: 0,
+      itemHeight: 0
+    };
+    var internalData = {
+      apTimeout: undefined,
+      stopFlag: false
+    };
+    return {
+      xID: xID,
+      reactData: reactData,
+      internalData: internalData
+    };
+  },
+  provide: function provide() {
+    var $xeCarousel = this;
+    return {
+      $xeCarousel: $xeCarousel
+    };
+  },
+  computed: Object.assign(Object.assign({}, {}), {
+    computeListStyle: function computeListStyle() {
+      var $xeCarousel = this;
+      var props = $xeCarousel;
+      var reactData = $xeCarousel.reactData;
+      var vertical = props.vertical,
+        options = props.options;
+      var activeName = reactData.activeName,
+        itemWidth = reactData.itemWidth,
+        itemHeight = reactData.itemHeight,
+        staticItems = reactData.staticItems;
+      var list = (staticItems && staticItems.length ? staticItems : options) || [];
+      var activeIndex = Math.max(0, _xeUtils.default.findIndexOf(list, function (item) {
+        return item.name === activeName;
+      }));
+      var stys = {};
+      if (vertical) {
+        stys.transform = "translateY(-".concat(activeIndex * itemHeight, "px)");
+      } else {
+        stys.width = "".concat(itemWidth * list.length, "px");
+        stys.transform = "translateX(-".concat(activeIndex * itemWidth, "px)");
+      }
+      return stys;
+    }
+  }),
+  methods: {
+    //
+    // Method
+    //
+    dispatchEvent: function dispatchEvent(type, params, evnt) {
+      var $xeCarousel = this;
+      $xeCarousel.$emit(type, (0, _ui.createEvent)(evnt, {
+        $carousel: $xeCarousel
+      }, params));
+    },
+    emitModel: function emitModel(value) {
+      var $xeCarousel = this;
+      var _events = $xeCarousel._events;
+      $xeCarousel.$emit('input', value);
+      if (_events && _events.modelValue) {
+        $xeCarousel.$emit('modelValue', value);
+      } else {
+        $xeCarousel.$emit('model-value', value);
+      }
+    },
+    prev: function prev() {
+      var $xeCarousel = this;
+      if ($xeCarousel.handlePrevNext(false)) {
+        $xeCarousel.handleAutoPlay();
+      }
+      return $xeCarousel.$nextTick();
+    },
+    next: function next() {
+      var $xeCarousel = this;
+      if ($xeCarousel.handlePrevNext(true)) {
+        $xeCarousel.handleAutoPlay();
+      }
+      return $xeCarousel.$nextTick();
+    },
+    updateStyle: function updateStyle() {
+      var $xeCarousel = this;
+      var reactData = $xeCarousel.reactData;
+      $xeCarousel.$nextTick(function () {
+        var wrapperElem = $xeCarousel.$refs.refWrapperElem;
+        if (wrapperElem) {
+          reactData.itemWidth = wrapperElem.clientWidth;
+          reactData.itemHeight = wrapperElem.clientHeight;
+        }
+      });
+    },
+    clickItemEvent: function clickItemEvent(evnt, item) {
+      var $xeCarousel = this;
+      var reactData = $xeCarousel.reactData;
+      var value = item.name;
+      reactData.activeName = item.name;
+      $xeCarousel.emitModel(value);
+      $xeCarousel.$emit('change', {
+        value: value
+      }, evnt);
+      $xeCarousel.updateStyle();
+    },
+    initDefaultActive: function initDefaultActive(list) {
+      var $xeCarousel = this;
+      var props = $xeCarousel;
+      var reactData = $xeCarousel.reactData;
+      var activeName = null;
+      if (list && list.length) {
+        var validVal = false;
+        activeName = props.value;
+        list.forEach(function (item) {
+          if (activeName === item.name) {
+            validVal = true;
+          }
+        });
+        if (!validVal) {
+          activeName = list[0].name;
+          $xeCarousel.emitModel(activeName);
+        }
+      }
+      reactData.activeName = activeName;
+    },
+    handlePrevNext: function handlePrevNext(isNext) {
+      var $xeCarousel = this;
+      var props = $xeCarousel;
+      var reactData = $xeCarousel.reactData;
+      var options = props.options,
+        loop = props.loop;
+      var activeName = reactData.activeName,
+        staticItems = reactData.staticItems;
+      var list = (staticItems && staticItems.length ? staticItems : options) || [];
+      var index = Math.max(0, _xeUtils.default.findIndexOf(list, function (item) {
+        return item.name === activeName;
+      }));
+      if (index > -1) {
+        var item = null;
+        if (isNext) {
+          if (index < list.length - 1) {
+            item = list[index + 1];
+          } else {
+            if (loop) {
+              item = list[0];
+            }
+          }
+        } else {
+          if (index > 0) {
+            item = list[index - 1];
+          } else {
+            if (loop) {
+              item = list[list.length - 1];
+            }
+          }
+        }
+        if (item) {
+          var name = item.name;
+          var value = name;
+          reactData.activeName = name;
+          $xeCarousel.emitModel(value);
+          return true;
+        }
+      }
+      return false;
+    },
+    prevEvent: function prevEvent(evnt) {
+      var $xeCarousel = this;
+      var reactData = $xeCarousel.reactData;
+      if ($xeCarousel.handlePrevNext(false)) {
+        var value = reactData.activeName;
+        $xeCarousel.$emit('change', {
+          value: value
+        }, evnt);
+      }
+    },
+    nextEvent: function nextEvent(evnt) {
+      var $xeCarousel = this;
+      var reactData = $xeCarousel.reactData;
+      if ($xeCarousel.handlePrevNext(true)) {
+        var value = reactData.activeName;
+        $xeCarousel.$emit('change', {
+          value: value
+        }, evnt);
+      }
+    },
+    stopAutoPlay: function stopAutoPlay() {
+      var $xeCarousel = this;
+      var internalData = $xeCarousel.internalData;
+      var apTimeout = internalData.apTimeout;
+      internalData.stopFlag = true;
+      if (apTimeout) {
+        clearTimeout(apTimeout);
+        internalData.apTimeout = undefined;
+      }
+    },
+    handleAutoPlay: function handleAutoPlay() {
+      var $xeCarousel = this;
+      var props = $xeCarousel;
+      var internalData = $xeCarousel.internalData;
+      var autoPlay = props.autoPlay,
+        interval = props.interval;
+      var stopFlag = internalData.stopFlag;
+      $xeCarousel.stopAutoPlay();
+      if (autoPlay) {
+        internalData.stopFlag = false;
+        internalData.apTimeout = setTimeout(function () {
+          if (!stopFlag) {
+            $xeCarousel.handlePrevNext(true);
+          }
+        }, _xeUtils.default.toNumber(interval) || 300);
+      }
+    },
+    mouseenterEvent: function mouseenterEvent() {
+      var $xeCarousel = this;
+      $xeCarousel.stopAutoPlay();
+    },
+    mouseleaveEvent: function mouseleaveEvent() {
+      var $xeCarousel = this;
+      $xeCarousel.handleAutoPlay();
+    },
+    callSlot: function callSlot(slotFunc, params) {
+      var $xeCarousel = this;
+      var slots = $xeCarousel.$scopedSlots;
+      if (slotFunc) {
+        if (_xeUtils.default.isString(slotFunc)) {
+          slotFunc = slots[slotFunc] || null;
+        }
+        if (_xeUtils.default.isFunction(slotFunc)) {
+          return (0, _vn.getSlotVNs)(slotFunc(params));
+        }
+      }
+      return [];
+    },
+    //
+    // Render
+    //
+    renderItemWrapper: function renderItemWrapper(h, list) {
+      var $xeCarousel = this;
+      var props = $xeCarousel;
+      var reactData = $xeCarousel.reactData;
+      var height = props.height;
+      var activeName = reactData.activeName;
+      var listStyle = $xeCarousel.computeListStyle;
+      return h('div', {
+        class: 'vxe-carousel--list',
+        style: listStyle
+      }, list.map(function (item) {
+        var name = item.name,
+          url = item.url,
+          slots = item.slots;
+        var defaultSlot = slots ? slots.default : null;
+        return h('div', {
+          key: "".concat(name),
+          class: ['vxe-carousel--item-inner', {
+            'is--active': activeName === name
+          }],
+          style: height ? {
+            height: (0, _dom.toCssUnit)(height)
+          } : {}
+        }, defaultSlot ? $xeCarousel.callSlot(defaultSlot, {}) : [h('img', {
+          class: 'vxe-carousel--item-img',
+          attrs: {
+            src: url
+          }
+        })]);
+      }));
+    },
+    renderIndicators: function renderIndicators(h, list) {
+      var $xeCarousel = this;
+      var reactData = $xeCarousel.reactData;
+      var activeName = reactData.activeName;
+      return h('div', {
+        class: 'vxe-carousel--indicators'
+      }, list.map(function (item) {
+        var name = item.name;
+        return h('div', {
+          key: "".concat(name),
+          class: ['vxe-carousel--indicators-item', {
+            'is--active': activeName === name
+          }],
+          on: {
+            click: function click(evnt) {
+              $xeCarousel.clickItemEvent(evnt, item);
+            }
+          }
+        });
+      }));
+    },
+    renderVN: function renderVN(h) {
+      var $xeCarousel = this;
+      var props = $xeCarousel;
+      var slots = $xeCarousel.$scopedSlots;
+      var reactData = $xeCarousel.reactData;
+      var loading = props.loading,
+        height = props.height,
+        width = props.width,
+        showIndicators = props.showIndicators,
+        vertical = props.vertical,
+        options = props.options;
+      var staticItems = reactData.staticItems;
+      var defaultSlot = slots.default;
+      var list = (staticItems && staticItems.length ? staticItems : options) || [];
+      return h('div', {
+        ref: 'refElem',
+        class: ['vxe-carousel', "is--".concat(vertical ? 'vertical' : 'horizontal')],
+        style: width ? {
+          width: (0, _dom.toCssUnit)(width)
+        } : {},
+        on: {
+          mouseenter: $xeCarousel.mouseenterEvent,
+          mouseleave: $xeCarousel.mouseleaveEvent
+        }
+      }, [h('div', {
+        class: 'vxe-carousel--slots'
+      }, defaultSlot ? defaultSlot({}) : []), h('div', {
+        ref: 'refWrapperElem',
+        class: 'vxe-carousel--item-wrapper',
+        style: height ? {
+          height: (0, _dom.toCssUnit)(height)
+        } : {}
+      }, [$xeCarousel.renderItemWrapper(h, list)]), showIndicators ? $xeCarousel.renderIndicators(h, list) : (0, _ui.renderEmptyElement)($xeCarousel), h('div', {
+        class: 'vxe-carousel--btn-wrapper'
+      }, [h('div', {
+        class: 'vxe-carousel--previous-btn',
+        on: {
+          click: $xeCarousel.prevEvent
+        }
+      }, [h('i', {
+        class: vertical ? (0, _ui.getIcon)().CAROUSEL_VERTICAL_PREVIOUS : (0, _ui.getIcon)().CAROUSEL_HORIZONTAL_PREVIOUS
+      })]), h('div', {
+        class: 'vxe-carousel--next-btn',
+        on: {
+          click: $xeCarousel.nextEvent
+        }
+      }, [h('i', {
+        class: vertical ? (0, _ui.getIcon)().CAROUSEL_VERTICAL_NEXT : (0, _ui.getIcon)().CAROUSEL_HORIZONTAL_NEXT
+      })])]),
+      /**
+       * 加载中
+       */
+      h(_loading.default, {
+        class: 'vxe-carousel--loading',
+        props: {
+          value: loading
+        }
+      })]);
+    }
+  },
+  watch: {
+    options: function options() {
+      var $xeCarousel = this;
+      var props = $xeCarousel;
+      $xeCarousel.initDefaultActive(props.options);
+    },
+    'reactData.staticItems': function reactDataStaticItems() {
+      var $xeCarousel = this;
+      var reactData = $xeCarousel.reactData;
+      $xeCarousel.initDefaultActive(reactData.staticItems);
+    },
+    autoPlay: function autoPlay() {
+      var $xeCarousel = this;
+      $xeCarousel.handleAutoPlay();
+    }
+  },
+  created: function created() {
+    var $xeCarousel = this;
+    var props = $xeCarousel;
+    var reactData = $xeCarousel.reactData;
+    $xeCarousel.initDefaultActive(reactData.staticItems.length ? reactData.staticItems : props.options);
+  },
+  mounted: function mounted() {
+    var $xeCarousel = this;
+    $xeCarousel.handleAutoPlay();
+    $xeCarousel.updateStyle();
+  },
+  beforeDestroy: function beforeDestroy() {
+    var $xeCarousel = this;
+    $xeCarousel.stopAutoPlay();
+  },
+  render: function render(h) {
+    return this.renderVN(h);
+  }
+});
+/* define-vxe-component end */