amis 2.8.0 → 2.9.0

package/esm/renderers/Carousel.js

@@ -1,12 +1,12 @@
 /**
- * amis v2.8.0
+ * amis v2.9.0
  * Copyright 2018-2023 baidu
  */
 
-import { __extends, __awaiter, __generator, __read, __decorate, __metadata } from 'tslib';
+import { __extends, __awaiter, __generator, __read, __assign, __decorate, __metadata } from 'tslib';
 import React from 'react';
-import Transition, { ENTERING, ENTERED, EXITING } from 'react-transition-group/Transition';
-import { getPropValue, isArrayChildrenModified, resolveVariableAndFilter, createObject, isObject, autobind, ScopedContext, Renderer } from 'amis-core';
+import Transition, { ENTERING, ENTERED, EXITING, EXITED } from 'react-transition-group/Transition';
+import { getPropValue, isArrayChildrenModified, resolveVariableAndFilter, createObject, autobind, ScopedContext, Renderer, isObject } from 'amis-core';
 import { Icon, Html } from 'amis-ui';
 import ThemedImageThumb from './Image.js';
 
@@ -35,6 +35,7 @@ var Carousel = /** @class */ (function (_super) {
             options: _this.props.options || getPropValue(_this.props) || [],
             nextAnimation: ''
         };
+        _this.loading = false;
         return _this;
     }
     Carousel.prototype.componentDidMount = function () {
@@ -141,9 +142,17 @@ var Carousel = /** @class */ (function (_super) {
         }
     };
     Carousel.prototype.next = function () {
+        var multiple = this.props.multiple;
+        if (this.loading && multiple && multiple.count > 1) {
+            return;
+        }
         this.autoSlide('next');
     };
     Carousel.prototype.prev = function () {
+        var multiple = this.props.multiple;
+        if (this.loading && multiple && multiple.count > 1) {
+            return;
+        }
         this.autoSlide('prev');
     };
     Carousel.prototype.clearAutoTimeout = function () {
@@ -152,12 +161,15 @@ var Carousel = /** @class */ (function (_super) {
     };
     Carousel.prototype.changeSlide = function (index) {
         return __awaiter(this, void 0, void 0, function () {
-            var current, _a, dispatchEvent, data, rendererEvent;
+            var current, _a, dispatchEvent, data, multiple, rendererEvent;
             return __generator(this, function (_b) {
                 switch (_b.label) {
                     case 0:
                         current = this.state.current;
-                        _a = this.props, dispatchEvent = _a.dispatchEvent, data = _a.data;
+                        _a = this.props, dispatchEvent = _a.dispatchEvent, data = _a.data, multiple = _a.multiple;
+                        if (this.loading && multiple && multiple.count > 1) {
+                            return [2 /*return*/];
+                        }
                         return [4 /*yield*/, dispatchEvent('change', createObject(data, {
                                 activeIndex: index,
                                 prevIndex: current
@@ -190,46 +202,106 @@ var Carousel = /** @class */ (function (_super) {
                 React.createElement(Icon, { icon: "right-arrow", className: "icon" }))));
     };
     Carousel.prototype.handleMouseEnter = function () {
+        var multiple = this.props.multiple;
+        if (multiple && multiple.count > 1) {
+            return;
+        }
         this.clearAutoTimeout();
     };
     Carousel.prototype.handleMouseLeave = function () {
+        var multiple = this.props.multiple;
+        if (multiple && multiple.count > 1) {
+            return;
+        }
         this.prepareAutoSlide();
     };
+    // 处理options
+    Carousel.prototype.getNewOptions = function (options, count) {
+        if (count === void 0) { count = 1; }
+        var newOptions = options;
+        if (Array.isArray(options) && options.length) {
+            newOptions = new Array(options.length);
+            for (var i = 0; i < options.length; i++) {
+                newOptions[i] = new Array(count);
+                for (var j = 0; j < count; j++) {
+                    newOptions[i][j] = options[(i + j) % options.length];
+                }
+            }
+        }
+        return newOptions;
+    };
     Carousel.prototype.render = function () {
+        var _a;
         var _this = this;
-        var _a = this.props, render = _a.render, className = _a.className, style = _a.style, cx = _a.classnames, itemSchema = _a.itemSchema, animation = _a.animation, width = _a.width, height = _a.height, controls = _a.controls, controlsTheme = _a.controlsTheme, placeholder = _a.placeholder, data = _a.data, name = _a.name;
-        var _b = this.state, options = _b.options, current = _b.current, nextAnimation = _b.nextAnimation;
+        var _b = this.props, render = _b.render, className = _b.className, style = _b.style, cx = _b.classnames, itemSchema = _b.itemSchema, animation = _b.animation, width = _b.width, height = _b.height, controls = _b.controls, controlsTheme = _b.controlsTheme, placeholder = _b.placeholder, data = _b.data, name = _b.name, duration = _b.duration, multiple = _b.multiple, alwaysShowArrow = _b.alwaysShowArrow, icons = _b.icons;
+        var _c = this.state, options = _c.options, current = _c.current, nextAnimation = _c.nextAnimation;
         var body = null;
         var carouselStyles = style || {};
         width ? (carouselStyles.width = width + 'px') : '';
         height ? (carouselStyles.height = height + 'px') : '';
-        var _c = __read([
+        var _d = __read([
             controls.indexOf('dots') > -1,
             controls.indexOf('arrows') > -1
-        ], 2), dots = _c[0], arrows = _c[1];
+        ], 2), dots = _d[0], arrows = _d[1];
         var animationName = nextAnimation || animation;
         if (Array.isArray(options) && options.length) {
-            body = (React.createElement("div", { ref: this.wrapperRef, className: cx('Carousel-container'), onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, options.map(function (option, key) { return (React.createElement(Transition, { mountOnEnter: true, unmountOnExit: true, in: key === current, timeout: 500, key: key }, function (status) {
+            var multipleCount_1 = 1;
+            if (multiple && typeof multiple.count === 'number' && multiple.count >= 2) {
+                multipleCount_1 = Math.floor(multiple.count) < options.length ? Math.floor(multiple.count) : options.length;
+            }
+            var newOptions_1 = this.getNewOptions(options, multipleCount_1);
+            var transitionDuration_1 = multipleCount_1 > 1 && typeof duration === 'number'
+                ? "".concat(duration, "ms") : (duration || '500ms');
+            var timeout_1 = multipleCount_1 > 1 && typeof duration === 'number' ? duration : 500;
+            body = (React.createElement("div", { ref: this.wrapperRef, className: cx('Carousel-container'), onMouseEnter: this.handleMouseEnter, onMouseLeave: this.handleMouseLeave }, options.map(function (option, key) { return (React.createElement(Transition, { mountOnEnter: true, unmountOnExit: true, in: key === current, timeout: timeout_1, key: key }, function (status) {
                 var _a;
                 if (status === ENTERING) {
                     _this.wrapperRef.current &&
                         _this.wrapperRef.current.childNodes.forEach(function (item) { return item.offsetHeight; });
                 }
-                return (React.createElement("div", { className: cx('Carousel-item', animationName, animationStyles[status]) }, render("".concat(current, "/body"), itemSchema ? itemSchema : defaultSchema, {
-                    thumbMode: _this.props.thumbMode,
-                    data: createObject(data, isObject(option)
-                        ? option
-                        : (_a = { item: option }, _a[name] = option, _a))
-                })));
+                if (multipleCount_1 > 1) {
+                    if ((status === ENTERING || status === EXITING) && !_this.loading) {
+                        _this.loading = true;
+                    }
+                    else if ((status === ENTERED || status === EXITED) && _this.loading) {
+                        _this.loading = false;
+                    }
+                }
+                var transformStyles = (_a = {},
+                    _a[ENTERING] = 0,
+                    _a[ENTERED] = 0,
+                    _a[EXITING] = animationName === 'slideRight' ? 100 / multipleCount_1 : -100 / multipleCount_1,
+                    _a[EXITED] = animationName === 'slideRight' ? -100 / multipleCount_1 : 100 / multipleCount_1,
+                    _a);
+                var itemStyle = multipleCount_1 > 1 ? __assign({ transitionTimingFunction: 'linear', transitionDuration: transitionDuration_1 }, (animation === 'slide' ? { transform: "translateX(".concat(transformStyles[status], "%)") } : {})) : {};
+                var itemRender = function (option) {
+                    var _a;
+                    return render("".concat(current, "/body"), itemSchema ? itemSchema : defaultSchema, {
+                        thumbMode: _this.props.thumbMode,
+                        data: createObject(data, isObject(option)
+                            ? option
+                            : (_a = { item: option }, _a[name] = option, _a))
+                    });
+                };
+                return (React.createElement("div", { className: cx('Carousel-item', animationName, animationStyles[status]), style: itemStyle },
+                    multipleCount_1 === 1 ? itemRender(option) : null,
+                    multipleCount_1 > 1 ?
+                        newOptions_1[key].map(function (option, index) { return (React.createElement("div", { key: index, style: {
+                                width: 100 / multipleCount_1 + '%',
+                                height: '100%',
+                                float: 'left'
+                            } }, itemRender(option))); }) : null));
             })); })));
         }
-        return (React.createElement("div", { className: cx("Carousel Carousel--".concat(controlsTheme), className), style: carouselStyles },
+        return (React.createElement("div", { className: cx("Carousel Carousel--".concat(controlsTheme), (_a = {}, _a['Carousel-arrow--always'] = !!alwaysShowArrow, _a), className), style: carouselStyles },
             body ? body : placeholder,
             dots ? this.renderDots() : null,
-            arrows ? (React.createElement("div", { className: cx('Carousel-leftArrow'), onClick: this.prev },
-                React.createElement(Icon, { icon: "left-arrow", className: "icon" }))) : null,
-            arrows ? (React.createElement("div", { className: cx('Carousel-rightArrow'), onClick: this.next },
-                React.createElement(Icon, { icon: "right-arrow", className: "icon" }))) : null));
+            arrows ? (React.createElement("div", { className: cx('Carousel-leftArrow'), onClick: this.prev }, icons && icons.prev
+                ? React.isValidElement(icons.prev) ? icons.prev : render('arrow-prev', icons.prev)
+                : (React.createElement(Icon, { icon: "left-arrow", className: "icon" })))) : null,
+            arrows ? (React.createElement("div", { className: cx('Carousel-rightArrow'), onClick: this.next }, icons && icons.next
+                ? React.isValidElement(icons.next) ? icons.next : render('arrow-next', icons.next)
+                : (React.createElement(Icon, { icon: "right-arrow", className: "icon" })))) : null));
     };
     Carousel.defaultProps = {
         auto: true,
@@ -238,7 +310,9 @@ var Carousel = /** @class */ (function (_super) {
         controlsTheme: 'light',
         animation: 'fade',
         controls: ['dots', 'arrows'],
-        placeholder: '-'
+        placeholder: '-',
+        multiple: { count: 1 },
+        alwaysShowArrow: false
     };
     __decorate([
         autobind,

package/esm/renderers/Chart.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.8.0
+ * amis v2.9.0
  * Copyright 2018-2023 baidu
  */
 

package/esm/renderers/Code.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.8.0
+ * amis v2.9.0
  * Copyright 2018-2023 baidu
  */
 

package/esm/renderers/Collapse.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.8.0
+ * amis v2.9.0
  * Copyright 2018-2023 baidu
  */
 

package/esm/renderers/CollapseGroup.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.8.0
+ * amis v2.9.0
  * Copyright 2018-2023 baidu
  */
 

package/esm/renderers/Color.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.8.0
+ * amis v2.9.0
  * Copyright 2018-2023 baidu
  */
 

package/esm/renderers/Container.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.8.0
+ * amis v2.9.0
  * Copyright 2018-2023 baidu
  */
 

package/esm/renderers/Copyable.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.8.0
+ * amis v2.9.0
  * Copyright 2018-2023 baidu
  */
 

package/esm/renderers/Custom.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.8.0
+ * amis v2.9.0
  * Copyright 2018-2023 baidu
  */
 

package/esm/renderers/Date.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.8.0
+ * amis v2.9.0
  * Copyright 2018-2023 baidu
  */
 

package/esm/renderers/DateRange.js

@@ -1,5 +1,5 @@
 /**
- * amis v2.8.0
+ * amis v2.9.0
  * Copyright 2018-2023 baidu
  */