amis-ui 3.6.2 → 6.0.0

package/esm/components/Pagination.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.6.2
+ * amis-ui v6.0.0
  * Copyright 2018-2023 fex
  */
 
@@ -16,6 +16,7 @@ var Pagination = /** @class */ (function (_super) {
         var _this = _super.call(this, props) || this;
         _this.state = {
             pageNum: '',
+            internalPageNum: '1',
             perPage: Number(_this.props.perPage)
         };
         _this.handlePageNumChange = _this.handlePageNumChange.bind(_this);
@@ -30,6 +31,12 @@ var Pagination = /** @class */ (function (_super) {
             this.setState({ perPage: isInteger(perPage) ? perPage : 10 });
         }
     };
+    Pagination.prototype.componentWillReceiveProps = function (nextProps) {
+        if (this.props.mode === 'simple' &&
+            nextProps.activePage !== Number(this.state.internalPageNum)) {
+            this.setState({ internalPageNum: String(nextProps.activePage) });
+        }
+    };
     Pagination.prototype.handlePageNumChange = function (page, perPage, dir) {
         return __awaiter(this, void 0, void 0, function () {
             var _a, disabled, onPageChange, _page;
@@ -65,9 +72,23 @@ var Pagination = /** @class */ (function (_super) {
      * @param page 页码
      */
     Pagination.prototype.renderEllipsis = function (key) {
-        var cx = this.props.classnames;
-        return (React__default.createElement("li", { key: key, className: cx('ellipsis') },
-            React__default.createElement("a", { role: "button" }, "...")));
+        var _this = this;
+        var _a = this.props, cx = _a.classnames, activePage = _a.activePage, ellipsisPageGap = _a.ellipsisPageGap;
+        var perPage = this.state.perPage;
+        var lastPage = this.getLastPage();
+        var gap = isNaN(Number(ellipsisPageGap)) || Number(ellipsisPageGap) < 1
+            ? 5
+            : Number(ellipsisPageGap);
+        var isPrevEllipsis = key === 'prev-ellipsis';
+        var jumpContent = isPrevEllipsis ? (React__default.createElement(Icon, { icon: "arrow-double-left", className: "icon" })) : (React__default.createElement(Icon, { icon: "arrow-double-right", className: "icon" }));
+        var jumpPage = isPrevEllipsis
+            ? Math.max(1, activePage - gap)
+            : Math.min(lastPage, activePage + gap);
+        return (React__default.createElement("li", { key: key, className: cx('Pagination-ellipsis'), onClick: function (e) {
+                return _this.handlePageNumChange(jumpPage, perPage, isPrevEllipsis ? 'backward' : 'forward');
+            } },
+            React__default.createElement("a", { role: "button" }, "..."),
+            React__default.createElement("span", { className: "icon" }, jumpContent)));
     };
     /**
      * 渲染器事件方法装饰器
@@ -125,15 +146,58 @@ var Pagination = /** @class */ (function (_super) {
         }
         this.setState({ pageNum: value });
     };
+    /**
+     * 简洁模式input onChange/onKeyUp事件
+     *
+     * @param event
+     */
+    Pagination.prototype.handleSimpleKeyUp = function (e) {
+        var lastPage = this.getLastPage();
+        var key = e.key;
+        var v = parseInt(e.currentTarget.value, 10);
+        // handle keyboard up and down events value
+        switch (key) {
+            case "ArrowDown" /* KeyCode.DOWN */:
+                v = isNaN(v) || v < 2 ? 1 : v - 1;
+                break;
+            case "ArrowUp" /* KeyCode.UP */:
+                v = v + 1;
+                break;
+        }
+        // validate inputvalue
+        if (/^\d+$/.test(String(v)) && v >= lastPage) {
+            v = lastPage;
+        }
+        this.setState({ internalPageNum: String(v) });
+        // handle empty val
+        if (!v) {
+            this.setState({ internalPageNum: '' });
+            return;
+        }
+        if (["ArrowUp" /* KeyCode.UP */, "ArrowDown" /* KeyCode.DOWN */, "Enter" /* KeyCode.ENTER */].includes(key)) {
+            this.handlePageNumChange(v, this.props.perPage);
+        }
+    };
+    /**
+     * 简洁模式input onBlur事件
+     */
+    Pagination.prototype.handleSimpleBlur = function () {
+        this.setState({ internalPageNum: String(this.props.activePage) });
+    };
     Pagination.prototype.render = function () {
         var _this = this;
-        var _a = this.props, layout = _a.layout, mode = _a.mode, activePage = _a.activePage, total = _a.total, showPerPage = _a.showPerPage, perPageAvailable = _a.perPageAvailable, cx = _a.classnames, showPageInput = _a.showPageInput, className = _a.className, style = _a.style, disabled = _a.disabled, hasNext = _a.hasNext, popOverContainer = _a.popOverContainer, popOverContainerSelector = _a.popOverContainerSelector, mobileUI = _a.mobileUI, __ = _a.translate;
+        var _a = this.props, layout = _a.layout, mode = _a.mode, activePage = _a.activePage, total = _a.total, showPerPage = _a.showPerPage, perPageAvailable = _a.perPageAvailable, cx = _a.classnames, showPageInput = _a.showPageInput, className = _a.className, style = _a.style, disabled = _a.disabled, hasNext = _a.hasNext, popOverContainer = _a.popOverContainer, popOverContainerSelector = _a.popOverContainerSelector, mobileUI = _a.mobileUI, size = _a.size, __ = _a.translate;
         var maxButtons = this.props.maxButtons;
-        var _b = this.state, pageNum = _b.pageNum, perPage = _b.perPage;
+        var _b = this.state, pageNum = _b.pageNum, perPage = _b.perPage, internalPageNum = _b.internalPageNum;
         var lastPage = this.getLastPage();
-        // 简易模式
+        var simplePager = null;
+        // 简洁模式
         if (mode === 'simple') {
-            return (React__default.createElement("div", { className: cx('Pagination-wrap', 'Pagination-simple', { disabled: disabled }, className), style: style },
+            simplePager = (React__default.createElement("li", { className: cx('Pagination-simplego'), key: "simple-go" },
+                React__default.createElement("input", { className: cx('Pagination-simplego-input'), key: "simple-input", type: "text", disabled: disabled, onChange: this.handleSimpleKeyUp, onKeyUp: this.handleSimpleKeyUp, onBlur: this.handleSimpleBlur, value: internalPageNum }),
+                "/",
+                React__default.createElement("span", { className: cx('Pagination-simplego-right'), key: "go-right" }, lastPage)));
+            return (React__default.createElement("div", { className: cx('Pagination-wrap', "Pagination-wrap-size--".concat(size), 'Pagination-simple', { disabled: disabled }, className), style: style },
                 React__default.createElement("ul", { key: "pager-items", className: cx('Pagination', 'Pagination--sm', 'Pagination-pager-items', 'Pagination-item') },
                     React__default.createElement("li", { className: cx('Pagination-prev', {
                             'is-disabled': activePage < 2
@@ -145,6 +209,7 @@ var Pagination = /** @class */ (function (_super) {
                         }, key: "prev" },
                         React__default.createElement("span", null,
                             React__default.createElement(Icon, { icon: "left-arrow", className: "icon" }))),
+                    simplePager,
                     React__default.createElement("li", { className: cx('Pagination-next', {
                             'is-disabled': !hasNext
                         }), onClick: function (e) {
@@ -258,7 +323,7 @@ var Pagination = /** @class */ (function (_super) {
         var totalPage = !(total || lastPage) ? null : (React__default.createElement("div", { className: cx('Pagination-total Pagination-item'), key: "total" }, total || total === 0
             ? __('Pagination.totalCount', { total: total })
             : __('Pagination.totalPage', { lastPage: lastPage })));
-        return (React__default.createElement("div", { className: cx('Pagination-wrap', { disabled: disabled }, className) }, layoutList.map(function (layoutItem) {
+        return (React__default.createElement("div", { className: cx('Pagination-wrap', "Pagination-wrap-size--".concat(size), { disabled: disabled }, className) }, layoutList.map(function (layoutItem) {
             if (layoutItem === "pager" /* PaginationWidget.Pager */) {
                 return (React__default.createElement("ul", { key: "pager-items", className: cx('Pagination', 'Pagination--sm', 'Pagination-item') }, pageButtons));
             }
@@ -282,7 +347,9 @@ var Pagination = /** @class */ (function (_super) {
         mode: 'normal',
         activePage: 1,
         perPage: 10,
-        perPageAvailable: [10, 20, 50, 100]
+        perPageAvailable: [10, 20, 50, 100],
+        ellipsisPageGap: 5,
+        size: 'md'
     };
     __decorate([
         autobind,
@@ -290,6 +357,18 @@ var Pagination = /** @class */ (function (_super) {
         __metadata("design:paramtypes", [Object]),
         __metadata("design:returntype", void 0)
     ], Pagination.prototype, "handlePageChange", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", [Object]),
+        __metadata("design:returntype", void 0)
+    ], Pagination.prototype, "handleSimpleKeyUp", null);
+    __decorate([
+        autobind,
+        __metadata("design:type", Function),
+        __metadata("design:paramtypes", []),
+        __metadata("design:returntype", void 0)
+    ], Pagination.prototype, "handleSimpleBlur", null);
     return Pagination;
 }(React__default.Component));
 var Pagination$1 = themeable(localeable(Pagination));

package/esm/components/Picker.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.6.2
+ * amis-ui v6.0.0
  * Copyright 2018-2023 fex
  */
 

package/esm/components/PickerColumn.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.6.2
+ * amis-ui v6.0.0
  * Copyright 2018-2023 fex
  */
 

package/esm/components/PickerContainer.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.6.2
+ * amis-ui v6.0.0
  * Copyright 2018-2023 fex
  */
 

package/esm/components/PopOverContainer.d.ts

@@ -6,10 +6,12 @@ export interface PopOverOverlay {
 }
 export interface PopOverContainerProps {
     children: (props: {
+        disabled?: boolean;
         onClick: (e: React.MouseEvent) => void;
         isOpened: boolean;
         ref: any;
     }) => JSX.Element;
+    disabled?: boolean;
     popOverRender: (props: {
         onClose: () => void;
     }) => JSX.Element;

package/esm/components/PopOverContainer.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.6.2
+ * amis-ui v6.0.0
  * Copyright 2018-2023 fex
  */
 
@@ -23,9 +23,10 @@ var PopOverContainer = /** @class */ (function (_super) {
         this.target = target ? findDOMNode(target) : null;
     };
     PopOverContainer.prototype.handleClick = function () {
-        this.setState({
-            isOpened: true
-        });
+        this.props.disabled ||
+            this.setState({
+                isOpened: true
+            });
     };
     PopOverContainer.prototype.close = function () {
         var _a = this.props, onBeforeHide = _a.onBeforeHide, onAfterHide = _a.onAfterHide;
@@ -85,12 +86,13 @@ var PopOverContainer = /** @class */ (function (_super) {
             _a;
     };
     PopOverContainer.prototype.render = function () {
-        var _a = this.props, mobileUI = _a.mobileUI, children = _a.children, popOverContainer = _a.popOverContainer, popOverClassName = _a.popOverClassName, dropdownRender = _a.popOverRender, placement = _a.placement, align = _a.align, showConfirm = _a.showConfirm; _a.onConfirm;
+        var _a = this.props, mobileUI = _a.mobileUI, children = _a.children, popOverContainer = _a.popOverContainer, popOverClassName = _a.popOverClassName, dropdownRender = _a.popOverRender, placement = _a.placement, align = _a.align, showConfirm = _a.showConfirm; _a.onConfirm; var disabled = _a.disabled;
         return (React__default.createElement(React__default.Fragment, null,
             children({
                 isOpened: this.state.isOpened,
                 onClick: this.handleClick,
-                ref: this.targetRef
+                ref: this.targetRef,
+                disabled: disabled
             }),
             mobileUI ? (React__default.createElement(PopUp, { isShow: this.state.isOpened, container: document.body, className: popOverClassName, showConfirm: showConfirm, onHide: this.close, onConfirm: this.onConfirm }, dropdownRender({ onClose: this.close }))) : (React__default.createElement(Overlay, { container: popOverContainer || this.getParent, target: this.getTarget, placement: placement || PopOverContainer.alignToPlacement({ align: align }), show: this.state.isOpened },
                 React__default.createElement(PopOver, { overlay: true, className: popOverClassName, style: this.getOverlayStyle(), onHide: this.close }, dropdownRender({ onClose: this.close }))))));

package/esm/components/PopUp.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.6.2
+ * amis-ui v6.0.0
  * Copyright 2018-2023 fex
  */
 

package/esm/components/Progress.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.6.2
+ * amis-ui v6.0.0
  * Copyright 2018-2023 fex
  */
 
@@ -120,7 +120,7 @@ var Progress = /** @class */ (function (_super) {
                     this.getLabel(prefixCls))
             ];
         }
-        return React__default.createElement("div", { className: cx('Progress', className), style: style }, viewValue);
+        return (React__default.createElement("div", { className: cx('Progress', className), style: style }, viewValue));
     };
     Progress.defaultProps = {
         type: 'line',

package/esm/components/PullRefresh.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.6.2
+ * amis-ui v6.0.0
  * Copyright 2018-2023 fex
  */
 

package/esm/components/Radios.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.6.2
+ * amis-ui v6.0.0
  * Copyright 2018-2023 fex
  */
 

package/esm/components/Range.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.6.2
+ * amis-ui v6.0.0
  * Copyright 2018-2023 fex
  */
 

package/esm/components/Rating.js

@@ -1,5 +1,5 @@
 /**
- * amis-ui v3.6.2
+ * amis-ui v6.0.0
  * Copyright 2018-2023 fex
  */