@nutui/nutui-react 1.4.0 → 1.4.1

package/dist/esm/types/src/packages/virtuallist/type.d.ts

@@ -1,5 +1,5 @@
 /// <reference types="react" />
-export declare type Data = any;
+export type Data = any;
 export interface VirtualListState {
     startOffset: number;
     startIndex: number;

package/dist/esm/types/src/packages/virtuallist/virtuallist.d.ts

@@ -1,4 +1,4 @@
 import { FunctionComponent } from 'react';
 import { BasicVirtualListProps } from './type';
-export declare type VirtualListProps = BasicVirtualListProps;
+export type VirtualListProps = BasicVirtualListProps;
 export declare const VirtualList: FunctionComponent<VirtualListProps>;

package/dist/esm/types/src/utils/get-scroll-parent.d.ts

@@ -1,3 +1,3 @@
-declare type ScrollElement = HTMLElement | Window;
+type ScrollElement = HTMLElement | Window;
 export declare function getScrollParent(el: Element, root?: ScrollElement | null | undefined): Window | Element | null | undefined;
 export {};

package/dist/esm/types/src/utils/render.d.ts

@@ -1,7 +1,7 @@
 import { ReactElement } from 'react';
 import type { Root } from 'react-dom/client';
 declare const MARK = "__nutui_react_root__";
-declare type ContainerType = (Element | DocumentFragment) & {
+type ContainerType = (Element | DocumentFragment) & {
     [MARK]?: Root;
 };
 export declare function render(node: ReactElement, container: ContainerType): void;

package/dist/esm/types/src/utils/useTouch.d.ts

@@ -1,4 +1,4 @@
-declare type Direction = '' | 'vertical' | 'horizontal';
+type Direction = '' | 'vertical' | 'horizontal';
 export declare function useTouch(): {
     move: EventListener;
     start: EventListener;

package/dist/esm/types/src/utils/useWatch.d.ts

@@ -1,5 +1,5 @@
-declare type Callback<T> = (prev: T | undefined) => void;
-declare type Config = {
+type Callback<T> = (prev: T | undefined) => void;
+type Config = {
     immediate: boolean;
 };
 declare function useWatch<T>(dep: T, callback: Callback<T>, config?: Config): () => void;

package/dist/locales/base.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v1.4.0-beta.1 Wed Dec 21 2022 14:30:05 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v1.4.1-beta.0 Wed Dec 28 2022 16:48:51 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/en-US.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v1.4.0-beta.1 Wed Dec 21 2022 14:30:05 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v1.4.1-beta.0 Wed Dec 28 2022 16:48:51 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/id-ID.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v1.4.0-beta.1 Wed Dec 21 2022 14:30:05 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v1.4.1-beta.0 Wed Dec 28 2022 16:48:51 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/zh-CN.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v1.4.0-beta.1 Wed Dec 21 2022 14:30:05 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v1.4.1-beta.0 Wed Dec 28 2022 16:48:51 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/zh-TW.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v1.4.0-beta.1 Wed Dec 21 2022 14:30:05 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v1.4.1-beta.0 Wed Dec 28 2022 16:48:51 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/locales/zh-UG.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v1.4.0-beta.1 Wed Dec 21 2022 14:30:05 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v1.4.1-beta.0 Wed Dec 28 2022 16:48:51 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */

package/dist/nutui.react.es.js

@@ -1,5 +1,5 @@
 /*!
-* @nutui/nutui-react v1.4.0-beta.1 Wed Dec 21 2022 14:29:34 GMT+0800 (China Standard Time)
+* @nutui/nutui-react v1.4.1-beta.0 Wed Dec 28 2022 16:47:00 GMT+0800 (中国标准时间)
 * (c) 2022 @jdf2e.
 * Released under the MIT License.
 */
@@ -398,7 +398,7 @@ var classnames = { exports: {} };
 })(classnames);
 var classNames = classnames.exports;
 const defaultOverlayProps = {
-  zIndex: 2e3,
+  zIndex: 1e3,
   duration: 0.3,
   overlayClass: "",
   closeOnClickOverlay: true,
@@ -969,7 +969,7 @@ const defaultProps$1o = {
   },
   ...defaultOverlayProps
 };
-let _zIndex = 2e3;
+let _zIndex = 1e3;
 const Popup = (props) => {
   const {
     children,
@@ -7704,7 +7704,7 @@ const TabbarItem = (props) => {
     ])
   }, tabTitle)));
 };
-function clamp(v, min, max) {
+function clamp$1(v, min, max) {
   return Math.max(min, Math.min(v, max));
 }
 const V = {
@@ -7735,7 +7735,7 @@ function rubberband$1(distance, dimension, constant) {
 }
 function rubberbandIfOutOfBounds$1(position, min, max, constant = 0.15) {
   if (constant === 0)
-    return clamp(position, min, max);
+    return clamp$1(position, min, max);
   if (position < min)
     return -rubberband$1(min - position, max - min, constant) + min;
   if (position > max)
@@ -8624,15 +8624,14 @@ const dragConfigResolver = _objectSpread2(_objectSpread2({}, coordinatesConfigRe
   pointerCapture(_v, _k, {
     pointer: {
       capture = true,
-      buttons = 1
+      buttons = 1,
+      keys = true
     } = {}
   }) {
     this.pointerButtons = buttons;
+    this.keys = keys;
     return !this.pointerLock && this.device === "pointer" && capture;
   },
-  keys(value = true) {
-    return value;
-  },
   threshold(value, _k, {
     filterTaps = false,
     tapsThreshold = 3,
@@ -9233,7 +9232,7 @@ const sharedConfigResolver = {
     return value;
   }
 };
-const _excluded$4 = ["target", "eventOptions", "window", "enabled", "transform"];
+const _excluded$3 = ["target", "eventOptions", "window", "enabled", "transform"];
 function resolveWith(config2 = {}, resolvers) {
   const result = {};
   for (const [key, resolver] of Object.entries(resolvers)) {
@@ -9261,7 +9260,7 @@ function parse(newConfig, gestureKey, _config = {}) {
     window: window2,
     enabled,
     transform
-  } = _ref, rest = _objectWithoutProperties(_ref, _excluded$4);
+  } = _ref, rest = _objectWithoutProperties(_ref, _excluded$3);
   _config.shared = resolveWith({
     target,
     eventOptions,
@@ -9862,6 +9861,7 @@ function findIndex(arr, test) {
   const index = arr.findIndex(test);
   return index < 0 ? arr.length : index;
 }
+const clamp = (min, max, v) => Math.min(Math.max(v, min), max);
 const colors = {
   transparent: 0,
   aliceblue: 4042850303,
@@ -10183,6 +10183,64 @@ function findRange(input, inputRange) {
       break;
   return i - 1;
 }
+const steps = (steps2, direction = "end") => (progress) => {
+  progress = direction === "end" ? Math.min(progress, 0.999) : Math.max(progress, 1e-3);
+  const expanded = progress * steps2;
+  const rounded = direction === "end" ? Math.floor(expanded) : Math.ceil(expanded);
+  return clamp(0, 1, rounded / steps2);
+};
+const c1 = 1.70158;
+const c2 = c1 * 1.525;
+const c3 = c1 + 1;
+const c4 = 2 * Math.PI / 3;
+const c5 = 2 * Math.PI / 4.5;
+const bounceOut = (x) => {
+  const n1 = 7.5625;
+  const d1 = 2.75;
+  if (x < 1 / d1) {
+    return n1 * x * x;
+  } else if (x < 2 / d1) {
+    return n1 * (x -= 1.5 / d1) * x + 0.75;
+  } else if (x < 2.5 / d1) {
+    return n1 * (x -= 2.25 / d1) * x + 0.9375;
+  } else {
+    return n1 * (x -= 2.625 / d1) * x + 0.984375;
+  }
+};
+const easings = {
+  linear: (x) => x,
+  easeInQuad: (x) => x * x,
+  easeOutQuad: (x) => 1 - (1 - x) * (1 - x),
+  easeInOutQuad: (x) => x < 0.5 ? 2 * x * x : 1 - Math.pow(-2 * x + 2, 2) / 2,
+  easeInCubic: (x) => x * x * x,
+  easeOutCubic: (x) => 1 - Math.pow(1 - x, 3),
+  easeInOutCubic: (x) => x < 0.5 ? 4 * x * x * x : 1 - Math.pow(-2 * x + 2, 3) / 2,
+  easeInQuart: (x) => x * x * x * x,
+  easeOutQuart: (x) => 1 - Math.pow(1 - x, 4),
+  easeInOutQuart: (x) => x < 0.5 ? 8 * x * x * x * x : 1 - Math.pow(-2 * x + 2, 4) / 2,
+  easeInQuint: (x) => x * x * x * x * x,
+  easeOutQuint: (x) => 1 - Math.pow(1 - x, 5),
+  easeInOutQuint: (x) => x < 0.5 ? 16 * x * x * x * x * x : 1 - Math.pow(-2 * x + 2, 5) / 2,
+  easeInSine: (x) => 1 - Math.cos(x * Math.PI / 2),
+  easeOutSine: (x) => Math.sin(x * Math.PI / 2),
+  easeInOutSine: (x) => -(Math.cos(Math.PI * x) - 1) / 2,
+  easeInExpo: (x) => x === 0 ? 0 : Math.pow(2, 10 * x - 10),
+  easeOutExpo: (x) => x === 1 ? 1 : 1 - Math.pow(2, -10 * x),
+  easeInOutExpo: (x) => x === 0 ? 0 : x === 1 ? 1 : x < 0.5 ? Math.pow(2, 20 * x - 10) / 2 : (2 - Math.pow(2, -20 * x + 10)) / 2,
+  easeInCirc: (x) => 1 - Math.sqrt(1 - Math.pow(x, 2)),
+  easeOutCirc: (x) => Math.sqrt(1 - Math.pow(x - 1, 2)),
+  easeInOutCirc: (x) => x < 0.5 ? (1 - Math.sqrt(1 - Math.pow(2 * x, 2))) / 2 : (Math.sqrt(1 - Math.pow(-2 * x + 2, 2)) + 1) / 2,
+  easeInBack: (x) => c3 * x * x * x - c1 * x * x,
+  easeOutBack: (x) => 1 + c3 * Math.pow(x - 1, 3) + c1 * Math.pow(x - 1, 2),
+  easeInOutBack: (x) => x < 0.5 ? Math.pow(2 * x, 2) * ((c2 + 1) * 2 * x - c2) / 2 : (Math.pow(2 * x - 2, 2) * ((c2 + 1) * (x * 2 - 2) + c2) + 2) / 2,
+  easeInElastic: (x) => x === 0 ? 0 : x === 1 ? 1 : -Math.pow(2, 10 * x - 10) * Math.sin((x * 10 - 10.75) * c4),
+  easeOutElastic: (x) => x === 0 ? 0 : x === 1 ? 1 : Math.pow(2, -10 * x) * Math.sin((x * 10 - 0.75) * c4) + 1,
+  easeInOutElastic: (x) => x === 0 ? 0 : x === 1 ? 1 : x < 0.5 ? -(Math.pow(2, 20 * x - 10) * Math.sin((20 * x - 11.125) * c5)) / 2 : Math.pow(2, -20 * x + 10) * Math.sin((20 * x - 11.125) * c5) / 2 + 1,
+  easeInBounce: (x) => 1 - bounceOut(1 - x),
+  easeOutBounce: bounceOut,
+  easeInOutBounce: (x) => x < 0.5 ? (1 - bounceOut(1 - 2 * x)) / 2 : (1 + bounceOut(2 * x - 1)) / 2,
+  steps
+};
 function _extends$3() {
   _extends$3 = Object.assign ? Object.assign.bind() : function(target) {
     for (var i = 1; i < arguments.length; i++) {
@@ -10864,57 +10922,6 @@ const config = {
     friction: 120
   }
 };
-const c1 = 1.70158;
-const c2 = c1 * 1.525;
-const c3 = c1 + 1;
-const c4 = 2 * Math.PI / 3;
-const c5 = 2 * Math.PI / 4.5;
-const bounceOut = (x) => {
-  const n1 = 7.5625;
-  const d1 = 2.75;
-  if (x < 1 / d1) {
-    return n1 * x * x;
-  } else if (x < 2 / d1) {
-    return n1 * (x -= 1.5 / d1) * x + 0.75;
-  } else if (x < 2.5 / d1) {
-    return n1 * (x -= 2.25 / d1) * x + 0.9375;
-  } else {
-    return n1 * (x -= 2.625 / d1) * x + 0.984375;
-  }
-};
-const easings = {
-  linear: (x) => x,
-  easeInQuad: (x) => x * x,
-  easeOutQuad: (x) => 1 - (1 - x) * (1 - x),
-  easeInOutQuad: (x) => x < 0.5 ? 2 * x * x : 1 - Math.pow(-2 * x + 2, 2) / 2,
-  easeInCubic: (x) => x * x * x,
-  easeOutCubic: (x) => 1 - Math.pow(1 - x, 3),
-  easeInOutCubic: (x) => x < 0.5 ? 4 * x * x * x : 1 - Math.pow(-2 * x + 2, 3) / 2,
-  easeInQuart: (x) => x * x * x * x,
-  easeOutQuart: (x) => 1 - Math.pow(1 - x, 4),
-  easeInOutQuart: (x) => x < 0.5 ? 8 * x * x * x * x : 1 - Math.pow(-2 * x + 2, 4) / 2,
-  easeInQuint: (x) => x * x * x * x * x,
-  easeOutQuint: (x) => 1 - Math.pow(1 - x, 5),
-  easeInOutQuint: (x) => x < 0.5 ? 16 * x * x * x * x * x : 1 - Math.pow(-2 * x + 2, 5) / 2,
-  easeInSine: (x) => 1 - Math.cos(x * Math.PI / 2),
-  easeOutSine: (x) => Math.sin(x * Math.PI / 2),
-  easeInOutSine: (x) => -(Math.cos(Math.PI * x) - 1) / 2,
-  easeInExpo: (x) => x === 0 ? 0 : Math.pow(2, 10 * x - 10),
-  easeOutExpo: (x) => x === 1 ? 1 : 1 - Math.pow(2, -10 * x),
-  easeInOutExpo: (x) => x === 0 ? 0 : x === 1 ? 1 : x < 0.5 ? Math.pow(2, 20 * x - 10) / 2 : (2 - Math.pow(2, -20 * x + 10)) / 2,
-  easeInCirc: (x) => 1 - Math.sqrt(1 - Math.pow(x, 2)),
-  easeOutCirc: (x) => Math.sqrt(1 - Math.pow(x - 1, 2)),
-  easeInOutCirc: (x) => x < 0.5 ? (1 - Math.sqrt(1 - Math.pow(2 * x, 2))) / 2 : (Math.sqrt(1 - Math.pow(-2 * x + 2, 2)) + 1) / 2,
-  easeInBack: (x) => c3 * x * x * x - c1 * x * x,
-  easeOutBack: (x) => 1 + c3 * Math.pow(x - 1, 3) + c1 * Math.pow(x - 1, 2),
-  easeInOutBack: (x) => x < 0.5 ? Math.pow(2 * x, 2) * ((c2 + 1) * 2 * x - c2) / 2 : (Math.pow(2 * x - 2, 2) * ((c2 + 1) * (x * 2 - 2) + c2) + 2) / 2,
-  easeInElastic: (x) => x === 0 ? 0 : x === 1 ? 1 : -Math.pow(2, 10 * x - 10) * Math.sin((x * 10 - 10.75) * c4),
-  easeOutElastic: (x) => x === 0 ? 0 : x === 1 ? 1 : Math.pow(2, -10 * x) * Math.sin((x * 10 - 0.75) * c4) + 1,
-  easeInOutElastic: (x) => x === 0 ? 0 : x === 1 ? 1 : x < 0.5 ? -(Math.pow(2, 20 * x - 10) * Math.sin((20 * x - 11.125) * c5)) / 2 : Math.pow(2, -20 * x + 10) * Math.sin((20 * x - 11.125) * c5) / 2 + 1,
-  easeInBounce: (x) => 1 - bounceOut(1 - x),
-  easeOutBounce: bounceOut,
-  easeInOutBounce: (x) => x < 0.5 ? (1 - bounceOut(1 - 2 * x)) / 2 : (1 + bounceOut(2 * x - 1)) / 2
-};
 const defaults = _extends$1({}, config.default, {
   mass: 1,
   damping: 1,
@@ -11110,7 +11117,7 @@ function runAsync(to2, props, state, target) {
     };
     const animate = (arg1, arg2) => {
       const bailSignal = new BailSignal();
-      const skipAnimationSignal = new SkipAniamtionSignal();
+      const skipAnimationSignal = new SkipAnimationSignal();
       return (async () => {
         if (globals.skipAnimation) {
           stopAsync(state);
@@ -11159,7 +11166,7 @@ function runAsync(to2, props, state, target) {
     } catch (err) {
       if (err instanceof BailSignal) {
         result = err.result;
-      } else if (err instanceof SkipAniamtionSignal) {
+      } else if (err instanceof SkipAnimationSignal) {
         result = err.result;
       } else {
         throw err;
@@ -11193,7 +11200,7 @@ class BailSignal extends Error {
     this.result = void 0;
   }
 }
-class SkipAniamtionSignal extends Error {
+class SkipAnimationSignal extends Error {
   constructor() {
     super("SkipAnimationSignal");
     this.result = void 0;
@@ -12224,11 +12231,11 @@ function _objectWithoutPropertiesLoose$1(source, excluded) {
   }
   return target;
 }
-const _excluded$3 = ["children"];
+const _excluded$6 = ["children"];
 const SpringContext = (_ref) => {
   let {
     children
-  } = _ref, props = _objectWithoutPropertiesLoose$1(_ref, _excluded$3);
+  } = _ref, props = _objectWithoutPropertiesLoose$1(_ref, _excluded$6);
   const inherited = useContext(ctx);
   const pause = props.pause || !!inherited.pause, immediate = props.immediate || !!inherited.immediate;
   props = useMemoOne(() => ({
@@ -12531,7 +12538,7 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   }
   return target;
 }
-const _excluded$2 = ["style", "children", "scrollTop", "scrollLeft"];
+const _excluded$2 = ["style", "children", "scrollTop", "scrollLeft", "viewBox"];
 const isCustomPropRE = /^--/;
 function dangerousStyleValue(name, value) {
   if (value == null || typeof value === "boolean" || value === "")
@@ -12550,7 +12557,8 @@ function applyAnimatedValues(instance, props) {
     style,
     children,
     scrollTop,
-    scrollLeft
+    scrollLeft,
+    viewBox
   } = _ref, attributes = _objectWithoutPropertiesLoose(_ref, _excluded$2);
   const values = Object.values(attributes);
   const names = Object.keys(attributes).map((name) => isFilterElement || instance.hasAttribute(name) ? name : attributeCache[name] || (attributeCache[name] = name.replace(/([A-Z])/g, (n) => "-" + n.toLowerCase())));
@@ -12576,6 +12584,9 @@ function applyAnimatedValues(instance, props) {
   if (scrollLeft !== void 0) {
     instance.scrollLeft = scrollLeft;
   }
+  if (viewBox !== void 0) {
+    instance.setAttribute("viewBox", viewBox);
+  }
 }
 let isUnitlessNumber = {
   animationIterationCount: true,
@@ -14083,7 +14094,6 @@ const Range = (props) => {
     button,
     vertical,
     marks,
-    change,
     dragStart,
     dragEnd,
     onChange,
@@ -14104,7 +14114,7 @@ const Range = (props) => {
   const root = useRef(null);
   const [marksList, SetMarksList] = useState([]);
   useEffect(() => {
-    if (modelValue) {
+    if (typeof modelValue === "number") {
       if (!range3 && (modelValue < min || modelValue > max)) {
         SetInitValue(0);
         Toast.text(`${modelValue} ${locale.range.rangeText}`);
@@ -14254,7 +14264,6 @@ const Range = (props) => {
       SetInitValue(value);
     }
     if ((marks || end) && !isSameValue(value, startValue)) {
-      change && change(value);
       onChange && onChange(value);
     }
   };
@@ -16557,7 +16566,8 @@ const Input = forwardRef((props, ref) => {
       `${disabled ? `${prefixCls}-disabled` : ""}`,
       `${required4 ? `${prefixCls}-required` : ""}`,
       `${error ? `${prefixCls}-error` : ""}`,
-      `${border ? `${prefixCls}-border` : ""}`
+      `${border ? `${prefixCls}-border` : ""}`,
+      `${slotButton || rightIcon ? `${prefixCls}-right-mark` : ""}`
     ].filter(Boolean).join(" ");
   }, [disabled, required4, error, border]);
   const updateValue = (value, trigger = "onChange") => {
@@ -16732,7 +16742,7 @@ const Input = forwardRef((props, ref) => {
     onClick: (e2) => {
       handleClear(e2);
     }
-  }) : null, rightIcon && rightIcon.length > 0 ? /* @__PURE__ */ React__default.createElement("div", {
+  }) : null), rightIcon && rightIcon.length > 0 ? /* @__PURE__ */ React__default.createElement("div", {
     className: "nut-input-right-icon",
     onClick: (e2) => {
       handleClickRightIcon(e2);
@@ -16744,7 +16754,7 @@ const Input = forwardRef((props, ref) => {
     size: rightIconSize
   })) : null, slotButton ? /* @__PURE__ */ React__default.createElement("div", {
     className: "nut-input-button"
-  }, slotButton) : null), showWordLimit && maxlength ? /* @__PURE__ */ React__default.createElement("div", {
+  }, slotButton) : null, showWordLimit && maxlength ? /* @__PURE__ */ React__default.createElement("div", {
     className: "nut-input-word-limit"
   }, /* @__PURE__ */ React__default.createElement("span", {
     className: "nut-input-word-num"
@@ -22166,6 +22176,7 @@ const defaultProps$w = {
   autoPlay: 0,
   direction: "horizontal",
   paginationColor: "#fff",
+  paginationBgColor: "#ddd",
   paginationVisible: false,
   loop: true,
   touchable: true,
@@ -22420,10 +22431,10 @@ const Swiper = React__default.forwardRef((props, ref) => {
       const val = isVertical ? rect.height - _size : rect.width - _size;
       _offset = moveOffset + (active === childCount - 1 && !props.loop ? -val / 2 : val / 2);
     }
-    target.style.transform = `translate3D${!isVertical ? `(${_offset}px,0,0)` : `(0,${_offset}px,0)`}`;
     target.style.transitionDuration = `${_swiper.current.moving ? 0 : props.duration}ms`;
     target.style[isVertical ? "height" : "width"] = `${Number(size) * childCount}px`;
     target.style[isVertical ? "width" : "height"] = `${isVertical ? width : height}px`;
+    target.style.transform = `translate3D${!isVertical ? `(${_offset}px,0,0)` : `(0,${_offset}px,0)`}`;
   };
   const onTouchStart = (e2) => {
     if (props.isPreventDefault)
@@ -22577,9 +22588,10 @@ const Swiper = React__default.forwardRef((props, ref) => {
     return /* @__PURE__ */ React__default.createElement("i", {
       style: (active + childCount) % childCount === index ? {
         backgroundColor: propSwiper.paginationColor
-      } : void 0,
+      } : {
+        backgroundColor: propSwiper.paginationBgColor
+      },
       className: classNames({
-        [`${b("pagination-item")}`]: true,
         active: (active + childCount) % childCount === index
       }),
       key: index