@nutui/nutui-react 2.3.11 → 2.3.12

package/dist/esm/InfiniteLoading.js

@@ -1,195 +1,122 @@
-import _asyncToGenerator from "@babel/runtime/helpers/asyncToGenerator";
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["children", "hasMore", "threshold", "target", "capture", "pullRefresh", "pullingText", "loadingText", "loadMoreText", "className", "onRefresh", "onLoadMore", "onScroll"];
-import _regeneratorRuntime from "@babel/runtime/regenerator";
-function ownKeys(e, r) {
-  var t = Object.keys(e);
-  if (Object.getOwnPropertySymbols) {
-    var o = Object.getOwnPropertySymbols(e);
-    r && (o = o.filter(function(r2) {
-      return Object.getOwnPropertyDescriptor(e, r2).enumerable;
-    })), t.push.apply(t, o);
-  }
-  return t;
-}
-function _objectSpread(e) {
-  for (var r = 1; r < arguments.length; r++) {
-    var t = null != arguments[r] ? arguments[r] : {};
-    r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
-      _defineProperty(e, r2, t[r2]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
-      Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
-    });
-  }
-  return e;
-}
+import { _ as __rest, a as __awaiter } from "./tslib.es6.js";
 import React__default, { useState, useRef, useEffect } from "react";
 import classNames from "classnames";
 import { useConfig } from "./ConfigProvider.js";
 import { C as ComponentDefaults } from "./typings.js";
-var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
-  hasMore: true,
-  threshold: 200,
-  target: "",
-  capture: false,
-  pullRefresh: false
-});
-var classPrefix = "nut-infiniteloading";
-var InfiniteLoading = function InfiniteLoading2(props) {
-  var _useConfig = useConfig(), locale = _useConfig.locale;
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), children = _defaultProps$props.children, hasMore = _defaultProps$props.hasMore, threshold = _defaultProps$props.threshold, target = _defaultProps$props.target, capture = _defaultProps$props.capture, pullRefresh = _defaultProps$props.pullRefresh, pullingText = _defaultProps$props.pullingText, loadingText = _defaultProps$props.loadingText, loadMoreText = _defaultProps$props.loadMoreText, className = _defaultProps$props.className, onRefresh = _defaultProps$props.onRefresh, onLoadMore = _defaultProps$props.onLoadMore, onScroll = _defaultProps$props.onScroll, restProps = _objectWithoutProperties(_defaultProps$props, _excluded);
-  var _useState = useState(false), _useState2 = _slicedToArray(_useState, 2), isInfiniting = _useState2[0], setIsInfiniting = _useState2[1];
-  var scroller = useRef(null);
-  var refreshTop = useRef(null);
-  var scrollEl = useRef(null);
-  var isTouching = useRef(false);
-  var beforeScrollTop = useRef(0);
-  var refreshMaxH = useRef(0);
-  var y = useRef(0);
-  var distance = useRef(0);
-  var classes = classNames(classPrefix, className);
-  useEffect(function() {
-    var _scrollEl$current;
+const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { hasMore: true, threshold: 200, target: "", capture: false, pullRefresh: false });
+const classPrefix = `nut-infiniteloading`;
+const InfiniteLoading = (props) => {
+  const { locale } = useConfig();
+  const _a = Object.assign(Object.assign({}, defaultProps), props), { children, hasMore, threshold, target, capture, pullRefresh, pullingText, loadingText, loadMoreText, className, onRefresh, onLoadMore, onScroll } = _a, restProps = __rest(_a, ["children", "hasMore", "threshold", "target", "capture", "pullRefresh", "pullingText", "loadingText", "loadMoreText", "className", "onRefresh", "onLoadMore", "onScroll"]);
+  const [isInfiniting, setIsInfiniting] = useState(false);
+  const scroller = useRef(null);
+  const refreshTop = useRef(null);
+  const scrollEl = useRef(null);
+  const isTouching = useRef(false);
+  const beforeScrollTop = useRef(0);
+  const refreshMaxH = useRef(0);
+  const y = useRef(0);
+  const distance = useRef(0);
+  const classes = classNames(classPrefix, className);
+  useEffect(() => {
+    var _a2;
     if (target && document.getElementById(target)) {
       scrollEl.current = document.getElementById(target);
     } else {
       scrollEl.current = window;
     }
-    (_scrollEl$current = scrollEl.current) === null || _scrollEl$current === void 0 || _scrollEl$current.addEventListener("scroll", handleScroll, capture);
-    return function() {
-      var _scrollEl$current2;
-      (_scrollEl$current2 = scrollEl.current) === null || _scrollEl$current2 === void 0 || _scrollEl$current2.removeEventListener("scroll", handleScroll, capture);
+    (_a2 = scrollEl.current) === null || _a2 === void 0 ? void 0 : _a2.addEventListener("scroll", handleScroll, capture);
+    return () => {
+      var _a3;
+      (_a3 = scrollEl.current) === null || _a3 === void 0 ? void 0 : _a3.removeEventListener("scroll", handleScroll, capture);
     };
   }, [hasMore, isInfiniting, onLoadMore]);
-  useEffect(function() {
-    var element = scroller.current;
-    element.addEventListener("touchmove", touchMove, {
-      passive: false
-    });
-    return function() {
+  useEffect(() => {
+    const element = scroller.current;
+    element.addEventListener("touchmove", touchMove, { passive: false });
+    return () => {
       element.removeEventListener("touchmove", touchMove, {
         passive: false
       });
     };
   }, []);
-  var getStyle = function getStyle2() {
+  const getStyle = () => {
     return {
-      height: distance.current < 0 ? "0px" : "".concat(distance.current, "px"),
-      transition: isTouching.current ? "height 0s cubic-bezier(0.25,0.1,0.25,1)" : "height 0.2s cubic-bezier(0.25,0.1,0.25,1)"
+      height: distance.current < 0 ? `0px` : `${distance.current}px`,
+      transition: isTouching.current ? `height 0s cubic-bezier(0.25,0.1,0.25,1)` : `height 0.2s cubic-bezier(0.25,0.1,0.25,1)`
     };
   };
-  var handleScroll = /* @__PURE__ */ function() {
-    var _ref = _asyncToGenerator(/* @__PURE__ */ _regeneratorRuntime.mark(function _callee() {
-      return _regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1)
-          switch (_context.prev = _context.next) {
-            case 0:
-              if (!(!isScrollAtBottom() || !hasMore || isInfiniting)) {
-                _context.next = 2;
-                break;
-              }
-              return _context.abrupt("return");
-            case 2:
-              setIsInfiniting(true);
-              _context.next = 5;
-              return onLoadMore === null || onLoadMore === void 0 ? void 0 : onLoadMore();
-            case 5:
-              infiniteDone();
-            case 6:
-            case "end":
-              return _context.stop();
-          }
-      }, _callee);
-    }));
-    return function handleScroll2() {
-      return _ref.apply(this, arguments);
-    };
-  }();
-  var infiniteDone = function infiniteDone2() {
+  const handleScroll = () => __awaiter(void 0, void 0, void 0, function* () {
+    if (!isScrollAtBottom() || !hasMore || isInfiniting) {
+      return;
+    }
+    setIsInfiniting(true);
+    yield onLoadMore === null || onLoadMore === void 0 ? void 0 : onLoadMore();
+    infiniteDone();
+  });
+  const infiniteDone = () => {
     setIsInfiniting(false);
   };
-  var getRefreshTop = function getRefreshTop2() {
+  const getRefreshTop = () => {
     return refreshTop.current;
   };
-  var refreshDone = function refreshDone2() {
+  const refreshDone = () => {
     distance.current = 0;
-    getRefreshTop().style.height = "".concat(distance.current, "px");
+    getRefreshTop().style.height = `${distance.current}px`;
     isTouching.current = false;
   };
-  var touchStart = function touchStart2(event) {
+  const touchStart = (event) => {
     if (beforeScrollTop.current === 0 && !isTouching.current && pullRefresh) {
       y.current = event.touches[0].pageY;
       isTouching.current = true;
-      var childHeight = getRefreshTop().firstElementChild.offsetHeight;
+      const childHeight = getRefreshTop().firstElementChild.offsetHeight;
       refreshMaxH.current = Math.floor(childHeight * 1 + 10);
     }
   };
-  var touchMove = function touchMove2(event) {
+  const touchMove = (event) => {
     distance.current = event.touches[0].pageY - y.current;
     if (distance.current > 0 && isTouching.current) {
       event.preventDefault();
       if (distance.current >= refreshMaxH.current) {
         distance.current = refreshMaxH.current;
-        getRefreshTop().style.height = "".concat(distance.current, "px");
+        getRefreshTop().style.height = `${distance.current}px`;
       } else {
-        getRefreshTop().style.height = "".concat(distance.current, "px");
+        getRefreshTop().style.height = `${distance.current}px`;
       }
     } else {
       distance.current = 0;
-      getRefreshTop().style.height = "".concat(distance.current, "px");
+      getRefreshTop().style.height = `${distance.current}px`;
       isTouching.current = false;
     }
   };
-  var touchEnd = /* @__PURE__ */ function() {
-    var _ref2 = _asyncToGenerator(/* @__PURE__ */ _regeneratorRuntime.mark(function _callee2() {
-      return _regeneratorRuntime.wrap(function _callee2$(_context2) {
-        while (1)
-          switch (_context2.prev = _context2.next) {
-            case 0:
-              if (!(distance.current < refreshMaxH.current)) {
-                _context2.next = 6;
-                break;
-              }
-              distance.current = 0;
-              getRefreshTop().style.height = "".concat(distance.current, "px");
-              isTouching.current = false;
-              _context2.next = 9;
-              break;
-            case 6:
-              _context2.next = 8;
-              return onRefresh === null || onRefresh === void 0 ? void 0 : onRefresh();
-            case 8:
-              refreshDone();
-            case 9:
-            case "end":
-              return _context2.stop();
-          }
-      }, _callee2);
-    }));
-    return function touchEnd2() {
-      return _ref2.apply(this, arguments);
-    };
-  }();
-  var getWindowScrollTop = function getWindowScrollTop2() {
+  const touchEnd = () => __awaiter(void 0, void 0, void 0, function* () {
+    if (distance.current < refreshMaxH.current) {
+      distance.current = 0;
+      getRefreshTop().style.height = `${distance.current}px`;
+      isTouching.current = false;
+    } else {
+      yield onRefresh === null || onRefresh === void 0 ? void 0 : onRefresh();
+      refreshDone();
+    }
+  });
+  const getWindowScrollTop = () => {
     return window.scrollY !== void 0 ? window.scrollY : (document.documentElement || document.body.parentNode || document.body).scrollTop;
   };
-  var calculateTopPosition = function calculateTopPosition2(el) {
-    return !el ? 0 : el.offsetTop + calculateTopPosition2(el.offsetParent);
+  const calculateTopPosition = (el) => {
+    return !el ? 0 : el.offsetTop + calculateTopPosition(el.offsetParent);
   };
-  var isScrollAtBottom = function isScrollAtBottom2() {
-    var offsetDistance = 0;
-    var resScrollTop = 0;
-    var direction = "down";
-    var windowScrollTop = getWindowScrollTop();
+  const isScrollAtBottom = () => {
+    let offsetDistance = 0;
+    let resScrollTop = 0;
+    let direction = "down";
+    const windowScrollTop = getWindowScrollTop();
     if (!target || !document.getElementById(target)) {
       if (scroller.current) {
         offsetDistance = calculateTopPosition(scroller.current) + scroller.current.offsetHeight - windowScrollTop - window.innerHeight;
       }
       resScrollTop = windowScrollTop;
     } else {
-      var _scrollEl$current3 = scrollEl.current, scrollHeight = _scrollEl$current3.scrollHeight, clientHeight = _scrollEl$current3.clientHeight, scrollTop = _scrollEl$current3.scrollTop;
+      const { scrollHeight, clientHeight, scrollTop } = scrollEl.current;
       offsetDistance = scrollHeight - clientHeight - scrollTop;
       resScrollTop = scrollTop;
     }
@@ -202,26 +129,17 @@ var InfiniteLoading = function InfiniteLoading2(props) {
     onScroll && onScroll(resScrollTop);
     return offsetDistance <= threshold && direction === "down";
   };
-  return React__default.createElement("div", _objectSpread({
-    className: classes,
-    ref: scroller,
-    onTouchStart: touchStart,
-    onTouchEnd: touchEnd
-  }, restProps), React__default.createElement("div", {
-    className: "nut-infinite-top",
-    ref: refreshTop,
-    style: getStyle()
-  }, React__default.createElement("div", {
-    className: "nut-infinite-top-tips"
-  }, pullingText || locale.infiniteloading.pullRefreshText)), React__default.createElement("div", {
-    className: "nut-infinite-container"
-  }, children), React__default.createElement("div", {
-    className: "nut-infinite-bottom"
-  }, isInfiniting ? React__default.createElement("div", {
-    className: "nut-infinite-bottom-tips"
-  }, loadingText || locale.infiniteloading.loadText) : !hasMore && React__default.createElement("div", {
-    className: "nut-infinite-bottom-tips"
-  }, loadMoreText || locale.infiniteloading.loadMoreText)));
+  return React__default.createElement(
+    "div",
+    Object.assign({ className: classes, ref: scroller, onTouchStart: touchStart, onTouchEnd: touchEnd }, restProps),
+    React__default.createElement(
+      "div",
+      { className: "nut-infinite-top", ref: refreshTop, style: getStyle() },
+      React__default.createElement("div", { className: "nut-infinite-top-tips" }, pullingText || locale.infiniteloading.pullRefreshText)
+    ),
+    React__default.createElement("div", { className: "nut-infinite-container" }, children),
+    React__default.createElement("div", { className: "nut-infinite-bottom" }, isInfiniting ? React__default.createElement("div", { className: "nut-infinite-bottom-tips" }, loadingText || locale.infiniteloading.loadText) : !hasMore && React__default.createElement("div", { className: "nut-infinite-bottom-tips" }, loadMoreText || locale.infiniteloading.loadMoreText))
+  );
 };
 InfiniteLoading.defaultProps = defaultProps;
 InfiniteLoading.displayName = "NutInfiniteLoading";

package/dist/esm/Input.js

@@ -1,46 +1,20 @@
-import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
-import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
-import _defineProperty from "@babel/runtime/helpers/defineProperty";
-var _excluded = ["type", "name", "placeholder", "align", "disabled", "readOnly", "maxLength", "clearable", "clearIcon", "formatTrigger", "autoFocus", "style", "className", "onChange", "onFocus", "onClear", "formatter", "onClick", "confirmType", "defaultValue", "value"];
-function ownKeys(e, r) {
-  var t = Object.keys(e);
-  if (Object.getOwnPropertySymbols) {
-    var o = Object.getOwnPropertySymbols(e);
-    r && (o = o.filter(function(r2) {
-      return Object.getOwnPropertyDescriptor(e, r2).enumerable;
-    })), t.push.apply(t, o);
-  }
-  return t;
-}
-function _objectSpread(e) {
-  for (var r = 1; r < arguments.length; r++) {
-    var t = null != arguments[r] ? arguments[r] : {};
-    r % 2 ? ownKeys(Object(t), true).forEach(function(r2) {
-      _defineProperty(e, r2, t[r2]);
-    }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(e, Object.getOwnPropertyDescriptors(t)) : ownKeys(Object(t)).forEach(function(r2) {
-      Object.defineProperty(e, r2, Object.getOwnPropertyDescriptor(t, r2));
-    });
-  }
-  return e;
-}
+import { _ as __rest } from "./tslib.es6.js";
 import React__default, { forwardRef, useRef, useState, useImperativeHandle, useCallback } from "react";
 import { MaskClose } from "@nutui/icons-react";
 import { useConfig } from "./ConfigProvider.js";
 import { C as ComponentDefaults } from "./typings.js";
 import { u as usePropsValue } from "./use-props-value.js";
-function trimExtraChar(value, _char, regExp) {
-  var index = value.indexOf(_char);
+function trimExtraChar(value, char, regExp) {
+  const index = value.indexOf(char);
   if (index === -1) {
     return value;
   }
-  if (_char === "-" && index !== 0) {
+  if (char === "-" && index !== 0) {
     return value.slice(0, index);
   }
   return value.slice(0, index + 1) + value.slice(index).replace(regExp, "");
 }
-function formatNumber(value) {
-  var allowDot = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : true;
-  var allowMinus = arguments.length > 2 && arguments[2] !== void 0 ? arguments[2] : true;
+function formatNumber(value, allowDot = true, allowMinus = true) {
   if (allowDot) {
     value = trimExtraChar(value, ".", /\./g);
   } else {
@@ -51,61 +25,46 @@ function formatNumber(value) {
   } else {
     value = value.replace(/-/, "");
   }
-  var regExp = allowDot ? /[^-0-9.]/g : /[^-0-9]/g;
+  const regExp = allowDot ? /[^-0-9.]/g : /[^-0-9]/g;
   return value.replace(regExp, "");
 }
-var defaultProps = _objectSpread(_objectSpread({}, ComponentDefaults), {}, {
-  type: "text",
-  name: "",
-  placeholder: "",
-  confirmType: "done",
-  align: "left",
-  required: false,
-  disabled: false,
-  readOnly: false,
-  maxLength: 9999,
-  clearable: false,
-  clearIcon: null,
-  formatTrigger: "onChange",
-  autoFocus: false
-});
-var Input = forwardRef(function(props, ref) {
-  var _useConfig = useConfig(), locale = _useConfig.locale;
-  var _defaultProps$props = _objectSpread(_objectSpread({}, defaultProps), props), type = _defaultProps$props.type, name = _defaultProps$props.name, placeholder = _defaultProps$props.placeholder, align = _defaultProps$props.align, disabled = _defaultProps$props.disabled, readOnly = _defaultProps$props.readOnly, maxLength = _defaultProps$props.maxLength, clearable = _defaultProps$props.clearable, clearIcon = _defaultProps$props.clearIcon, formatTrigger = _defaultProps$props.formatTrigger, autoFocus = _defaultProps$props.autoFocus, style = _defaultProps$props.style, className = _defaultProps$props.className, onChange = _defaultProps$props.onChange, onFocus = _defaultProps$props.onFocus, onClear = _defaultProps$props.onClear, formatter = _defaultProps$props.formatter, _onClick = _defaultProps$props.onClick, confirmType = _defaultProps$props.confirmType, defaultValue = _defaultProps$props.defaultValue, _value = _defaultProps$props.value, rest = _objectWithoutProperties(_defaultProps$props, _excluded);
-  var _usePropsValue = usePropsValue({
+const defaultProps = Object.assign(Object.assign({}, ComponentDefaults), { type: "text", name: "", placeholder: "", confirmType: "done", align: "left", required: false, disabled: false, readOnly: false, maxLength: 9999, clearable: false, clearIcon: null, formatTrigger: "onChange", autoFocus: false });
+const Input = forwardRef((props, ref) => {
+  const { locale } = useConfig();
+  const _a = Object.assign(Object.assign({}, defaultProps), props), { type, name, placeholder, align, disabled, readOnly, maxLength, clearable, clearIcon, formatTrigger, autoFocus, style, className, onChange, onFocus, onClear, formatter, onClick, confirmType, defaultValue, value: _value } = _a, rest = __rest(_a, ["type", "name", "placeholder", "align", "disabled", "readOnly", "maxLength", "clearable", "clearIcon", "formatTrigger", "autoFocus", "style", "className", "onChange", "onFocus", "onClear", "formatter", "onClick", "confirmType", "defaultValue", "value"]);
+  const [value, setValue] = usePropsValue({
     value: props.value,
     defaultValue: props.defaultValue,
     finalValue: "",
     onChange
-  }), _usePropsValue2 = _slicedToArray(_usePropsValue, 2), value = _usePropsValue2[0], setValue = _usePropsValue2[1];
-  var inputRef = useRef(null);
-  var composingRef = useRef(false);
-  var _useState = useState(false), _useState2 = _slicedToArray(_useState, 2), active = _useState2[0], setActive = _useState2[1];
-  useImperativeHandle(ref, function() {
+  });
+  const inputRef = useRef(null);
+  const composingRef = useRef(false);
+  const [active, setActive] = useState(false);
+  useImperativeHandle(ref, () => {
     return {
-      clear: function clear() {
+      clear: () => {
         setValue("");
       },
-      focus: function focus() {
-        var _inputRef$current;
-        (_inputRef$current = inputRef.current) === null || _inputRef$current === void 0 || _inputRef$current.focus();
+      focus: () => {
+        var _a2;
+        (_a2 = inputRef.current) === null || _a2 === void 0 ? void 0 : _a2.focus();
       },
-      blur: function blur() {
-        var _inputRef$current2;
-        (_inputRef$current2 = inputRef.current) === null || _inputRef$current2 === void 0 || _inputRef$current2.blur();
+      blur: () => {
+        var _a2;
+        (_a2 = inputRef.current) === null || _a2 === void 0 ? void 0 : _a2.blur();
       },
       get nativeElement() {
         return inputRef.current;
       }
     };
   });
-  var inputClass = useCallback(function() {
-    var classPrefix = "nut-input";
-    return [classPrefix, "".concat(disabled ? "".concat(classPrefix, "-disabled") : "")].filter(Boolean).join(" ");
+  const inputClass = useCallback(() => {
+    const classPrefix = "nut-input";
+    return [classPrefix, `${disabled ? `${classPrefix}-disabled` : ""}`].filter(Boolean).join(" ");
   }, [disabled]);
-  var updateValue = function updateValue2(value2) {
-    var trigger = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : "onChange";
-    var val = value2;
+  const updateValue = (value2, trigger = "onChange") => {
+    let val = value2;
     if (type === "number") {
       val = formatNumber(val, false, true);
     }
@@ -116,27 +75,27 @@ var Input = forwardRef(function(props, ref) {
       val = formatter(val);
     }
     setValue(val);
-    var eventHandler = props[trigger];
+    const eventHandler = props[trigger];
     if (eventHandler && typeof eventHandler === "function" && trigger !== "onChange") {
       eventHandler(val);
     }
   };
-  var handleFocus = function handleFocus2(event) {
-    var val = event.target.value;
+  const handleFocus = (event) => {
+    const val = event.target.value;
     onFocus && onFocus(val);
     setActive(true);
   };
-  var handleInput = function handleInput2(value2) {
+  const handleInput = (value2) => {
     updateValue(value2, "onChange");
   };
-  var handleBlur = function handleBlur2(event) {
-    var val = event.target.value;
+  const handleBlur = (event) => {
+    const val = event.target.value;
     updateValue(val, "onBlur");
-    setTimeout(function() {
+    setTimeout(() => {
       setActive(false);
     }, 200);
   };
-  var inputType = function inputType2(type2) {
+  const inputType = (type2) => {
     if (type2 === "digit") {
       return "text";
     }
@@ -145,63 +104,36 @@ var Input = forwardRef(function(props, ref) {
     }
     return type2;
   };
-  return React__default.createElement("div", {
-    className: "".concat(inputClass(), "  ").concat(className || ""),
-    style,
-    onClick: function onClick(e) {
-      _onClick && _onClick(e);
-    }
-  }, React__default.createElement("input", _objectSpread(_objectSpread({}, rest), {}, {
-    name,
-    className: "nut-input-native",
-    ref: inputRef,
-    style: {
-      textAlign: "".concat(
-        // eslint-disable-next-line no-nested-ternary
-        align === "right" ? "end" : align === "left" ? "start" : "center"
-      )
-    },
-    type: inputType(type),
-    maxLength,
-    placeholder: placeholder || locale.placeholder,
-    disabled,
-    readOnly,
-    value,
-    autoFocus,
-    enterKeyHint: confirmType,
-    onBlur: function onBlur(e) {
+  return React__default.createElement(
+    "div",
+    { className: `${inputClass()}  ${className || ""}`, style, onClick: (e) => {
+      onClick && onClick(e);
+    } },
+    React__default.createElement("input", Object.assign({}, rest, { name, className: "nut-input-native", ref: inputRef, style: {
+      textAlign: `${// eslint-disable-next-line no-nested-ternary
+      align === "right" ? "end" : align === "left" ? "start" : "center"}`
+    }, type: inputType(type), maxLength, placeholder: placeholder || locale.placeholder, disabled, readOnly, value, autoFocus, enterKeyHint: confirmType, onBlur: (e) => {
       handleBlur(e);
-    },
-    onFocus: function onFocus2(e) {
+    }, onFocus: (e) => {
       handleFocus(e);
-    },
-    onChange: function onChange2(e) {
+    }, onChange: (e) => {
       handleInput(e.currentTarget.value);
-    },
-    onCompositionStart: function onCompositionStart(e) {
-      var _props$onCompositionS;
+    }, onCompositionStart: (e) => {
+      var _a2;
       composingRef.current = true;
-      (_props$onCompositionS = props.onCompositionStart) === null || _props$onCompositionS === void 0 || _props$onCompositionS.call(props, e);
-    },
-    onCompositionEnd: function onCompositionEnd(e) {
-      var _props$onCompositionE;
+      (_a2 = props.onCompositionStart) === null || _a2 === void 0 ? void 0 : _a2.call(props, e);
+    }, onCompositionEnd: (e) => {
+      var _a2;
       composingRef.current = false;
-      (_props$onCompositionE = props.onCompositionEnd) === null || _props$onCompositionE === void 0 || _props$onCompositionE.call(props, e);
-    }
-  })), clearable && !readOnly && active && value.length > 0 ? React__default.createElement("span", {
-    style: {
-      display: "flex",
-      alignItems: "center"
-    },
-    onClick: function onClick() {
+      (_a2 = props.onCompositionEnd) === null || _a2 === void 0 ? void 0 : _a2.call(props, e);
+    } })),
+    clearable && !readOnly && active && value.length > 0 ? React__default.createElement("span", { style: { display: "flex", alignItems: "center" }, onClick: () => {
       if (!disabled) {
         setValue("");
         onClear && onClear("");
       }
-    }
-  }, clearIcon || React__default.createElement(MaskClose, {
-    className: "nut-input-clear"
-  })) : null);
+    } }, clearIcon || React__default.createElement(MaskClose, { className: "nut-input-clear" })) : null
+  );
 });
 Input.defaultProps = defaultProps;
 Input.displayName = "NutInput";