antd-mobile 5.0.0-beta.9 → 5.0.0-rc.3

package/2x/es/components/image-viewer/slide.d.ts

@@ -1,9 +1,10 @@
-import { FC } from 'react';
+import { FC, MutableRefObject } from 'react';
 declare type Props = {
     image: string;
     maxZoom: number;
     onTap: () => void;
     onZoomChange?: (zoom: number) => void;
+    dragLockRef?: MutableRefObject<boolean>;
 };
 export declare const Slide: FC<Props>;
 export {};

package/2x/es/components/image-viewer/slide.js

@@ -1,8 +1,11 @@
-import React from 'react';
-import { useGesture } from 'react-use-gesture';
+import React, { useRef } from 'react';
+import { useGesture } from '@use-gesture/react';
 import { useSpring, animated } from '@react-spring/web';
 var classPrefix = "adm-image-viewer";
 export var Slide = function Slide(props) {
+  var dragLockRef = props.dragLockRef;
+  var controlRef = useRef(null);
+
   var _useSpring = useSpring(function () {
     return {
       zoom: 1,
@@ -19,7 +22,8 @@ export var Slide = function Slide(props) {
       y = _useSpring$.y,
       api = _useSpring[1];
 
-  var bind = useGesture({
+  var pinchLockRef = useRef(false);
+  useGesture({
     onDrag: function onDrag(state) {
       if (state.tap && state.elapsedTime > 0) {
         // 判断点击时间>0是为了过滤掉非正常操作，例如用户长按选择图片之后的取消操作（也是一次点击）
@@ -29,31 +33,38 @@ export var Slide = function Slide(props) {
 
       var currentZoom = zoom.get();
 
-      if (currentZoom <= 1) {
+      if (dragLockRef) {
+        dragLockRef.current = currentZoom !== 1;
+      }
+
+      if (!pinchLockRef.current && currentZoom <= 1) {
         api.start({
           x: 0,
           y: 0
         });
       } else {
-        var _state$movement = state.movement,
-            _x = _state$movement[0],
-            _y = _state$movement[1];
+        var _state$offset = state.offset,
+            _x = _state$offset[0],
+            _y = _state$offset[1];
         api.start({
           x: _x,
-          y: _y
+          y: _y,
+          immediate: true
         });
       }
     },
     onPinch: function onPinch(state) {
       var _a;
 
-      var _state$movement2 = state.movement,
-          d = _state$movement2[0],
-          a = _state$movement2[1]; // pinch的rubberband不会自动弹回bound，这里手动实现了
+      pinchLockRef.current = !state.last;
+      var _state$offset2 = state.offset,
+          d = _state$offset2[0];
+      if (d < 0) return; // pinch的rubberband不会自动弹回bound，这里手动实现了
 
       var zoom = state.last ? Math.max(Math.min(d, props.maxZoom), 1) : d;
       api.start({
-        zoom: zoom
+        zoom: zoom,
+        immediate: !state.last
       });
       (_a = props.onZoomChange) === null || _a === void 0 ? void 0 : _a.call(props, zoom);
 
@@ -62,29 +73,36 @@ export var Slide = function Slide(props) {
           x: 0,
           y: 0
         });
+
+        if (dragLockRef) {
+          dragLockRef.current = false;
+        }
+      } else {
+        if (dragLockRef) {
+          dragLockRef.current = true;
+        }
       }
     }
   }, {
+    target: controlRef,
     drag: {
       // filterTaps: true,
-      initial: function initial() {
+      from: function from() {
         return [x.get(), y.get()];
       }
     },
     pinch: {
-      distanceBounds: {
-        min: 1,
-        max: props.maxZoom
-      },
-      rubberband: true,
       transform: function transform(_ref) {
-        var x = _ref[0],
-            y = _ref[1];
-        return [x / 200, y / 200];
+        var d = _ref[0],
+            a = _ref[1];
+        return [d < 0 ? d * 0.5 : d * 2, 0];
       },
-      initial: function initial() {
+      from: function from() {
         return [zoom.get(), 0];
       }
+    },
+    pointer: {
+      touch: true
     }
   });
   return /*#__PURE__*/React.createElement("div", {
@@ -94,9 +112,10 @@ export var Slide = function Slide(props) {
         e.stopPropagation();
       }
     }
-  }, /*#__PURE__*/React.createElement("div", Object.assign({
-    className: classPrefix + "-control"
-  }, bind()), /*#__PURE__*/React.createElement(animated.div, {
+  }, /*#__PURE__*/React.createElement("div", {
+    className: classPrefix + "-control",
+    ref: controlRef
+  }, /*#__PURE__*/React.createElement(animated.div, {
     className: classPrefix + "-image-wrapper",
     style: {
       scale: zoom,

package/2x/es/components/image-viewer/slides.js

@@ -1,5 +1,5 @@
-import React from 'react';
-import { useDrag } from 'react-use-gesture';
+import React, { useRef } from 'react';
+import { useDrag } from '@use-gesture/react';
 import { useSpring, animated } from '@react-spring/web';
 import { Slide } from './slide';
 import { convertPx } from '../../utils/convert-px';
@@ -10,9 +10,10 @@ export var Slides = function Slides(props) {
 
   var _useSpring = useSpring(function () {
     return {
-      x: -props.defaultIndex * slideWidth,
+      x: props.defaultIndex * slideWidth,
       config: {
-        tension: 300
+        tension: 250,
+        clamp: true
       }
     };
   }),
@@ -20,45 +21,60 @@ export var Slides = function Slides(props) {
       api = _useSpring[1];
 
   var count = props.images.length;
+  var dragLockRef = useRef(false);
   var bind = useDrag(function (state) {
-    var _state$movement = state.movement,
-        mx = _state$movement[0];
+    if (dragLockRef.current) return;
+    var _state$offset = state.offset,
+        offsetX = _state$offset[0];
 
     if (state.last) {
-      var index = bound(-Math.round((mx + state.vxvy[0] * 100) / slideWidth), 0, count - 1);
+      var minIndex = Math.floor(offsetX / slideWidth);
+      var maxIndex = minIndex + 1;
+      var velocityOffset = Math.min(state.velocity[0] * 2000, slideWidth) * state.direction[0];
+      var index = bound(bound(Math.round((offsetX + velocityOffset) / slideWidth), minIndex, maxIndex), 0, count - 1);
       api.start({
-        x: index * -slideWidth
+        x: index * slideWidth
       });
     } else {
       api.start({
-        x: mx
+        x: offsetX,
+        immediate: true
       });
     }
   }, {
-    initial: function initial() {
+    transform: function transform(_ref) {
+      var x = _ref[0],
+          y = _ref[1];
+      return [-x, y];
+    },
+    from: function from() {
       return [x.get(), 0];
     },
     bounds: function bounds() {
-      var index = -Math.round(x.get() / slideWidth);
       return {
-        right: Math.max(index - 1, 0) * -slideWidth,
-        left: Math.min(index + 1, count - 1) * -slideWidth
+        left: 0,
+        right: (count - 1) * slideWidth
       };
     },
     rubberband: true,
-    axis: 'x'
+    axis: 'x',
+    pointer: {
+      touch: true
+    }
   });
   return /*#__PURE__*/React.createElement("div", Object.assign({
     className: classPrefix + "-slides"
   }, bind()), /*#__PURE__*/React.createElement(animated.div, {
     className: classPrefix + "-indicator"
   }, x.to(function (v) {
-    var index = -Math.round(v / slideWidth);
+    var index = bound(Math.round(v / slideWidth), 0, count - 1);
     return index + 1 + " / " + count;
   })), /*#__PURE__*/React.createElement(animated.div, {
     className: classPrefix + "-slides-inner",
     style: {
-      x: x
+      x: x.to(function (x) {
+        return -x;
+      })
     }
   }, props.images.map(function (image) {
     return /*#__PURE__*/React.createElement(Slide, {
@@ -68,12 +84,13 @@ export var Slides = function Slides(props) {
       maxZoom: props.maxZoom,
       onZoomChange: function onZoomChange(zoom) {
         if (zoom !== 1) {
-          var index = -Math.round(x.get() / slideWidth);
+          var index = Math.round(x.get() / slideWidth);
           api.start({
-            x: index * -slideWidth
+            x: index * slideWidth
           });
         }
-      }
+      },
+      dragLockRef: dragLockRef
     });
   })));
 };

package/2x/es/components/index-bar/index-bar.css

@@ -4,7 +4,7 @@
   height: 100%;
   position: relative;
   background-color: var(--adm-color-white);
-  --sticy-offset-top: 0;
+  --sticky-offset-top: 0;
 }
 
 .adm-index-bar-body {
@@ -64,6 +64,10 @@
   padding: 0 24px;
 }
 
+.adm-index-bar-sidebar-row > * {
+  pointer-events: none;
+}
+
 .adm-index-bar-sidebar-item {
   display: inline-flex;
   width: 32px;
@@ -85,6 +89,6 @@
 
 .adm-index-bar-sticky .adm-index-bar-anchor-title {
   position: sticky;
-  top: var(--sticy-offset-top);
+  top: var(--sticky-offset-top);
   left: 0;
 }

package/2x/es/components/index-bar/index-bar.d.ts

@@ -1,17 +1,13 @@
 import React from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type IndexBarProps = {
-    className?: string;
     sticky?: boolean;
-    stickyOffsetTop?: number;
     children?: React.ReactNode;
-} & NativeProps;
+} & NativeProps<'--sticky-offset-top'>;
 export declare type IndexBarRef = {
     scrollTo: (index: string) => void;
 };
 export declare const IndexBar: React.ForwardRefExoticComponent<{
-    className?: string | undefined;
     sticky?: boolean | undefined;
-    stickyOffsetTop?: number | undefined;
     children?: React.ReactNode;
-} & NativeProps<never> & React.RefAttributes<IndexBarRef>>;
+} & NativeProps<"--sticky-offset-top"> & React.RefAttributes<IndexBarRef>>;

package/2x/es/components/index-bar/index-bar.js

@@ -1,11 +1,12 @@
-import React, { forwardRef, useRef, useState, useEffect, useImperativeHandle } from 'react';
+import React, { forwardRef, useRef, useState, useImperativeHandle } from 'react';
 import classNames from 'classnames';
 import { withNativeProps } from '../../utils/native-props';
 import { useThrottleFn } from 'ahooks';
 import { mergeProps } from '../../utils/with-default-props';
 import { Sidebar } from './sidebar';
-import { IndexBarContext } from './context';
 import { convertPx } from '../../utils/convert-px';
+import { Panel } from './panel';
+import { devWarning } from '../../utils/dev-log';
 var classPrefix = "adm-index-bar";
 var defaultProps = {
   sticky: true
@@ -16,14 +17,29 @@ export var IndexBar = /*#__PURE__*/forwardRef(function (p, ref) {
   var props = mergeProps(defaultProps, p);
   var titleHeight = convertPx(35);
   var bodyRef = useRef(null);
+  var indexes = [];
+  var panels = [];
+  React.Children.forEach(props.children, function (child) {
+    if (! /*#__PURE__*/React.isValidElement(child)) return;
 
-  var _useState = useState([]),
-      indexes = _useState[0],
-      setIndexes = _useState[1];
+    if (child.type !== Panel) {
+      devWarning('IndexBar', 'The children of `IndexBar` must be `IndexBar.Panel` components.');
+      return;
+    }
+
+    indexes.push(child.props.index);
+    panels.push(withNativeProps(child.props, /*#__PURE__*/React.createElement("div", {
+      key: child.props.index,
+      "data-index": child.props.index,
+      className: classPrefix + "-anchor"
+    }, /*#__PURE__*/React.createElement("div", {
+      className: classPrefix + "-anchor-title"
+    }, child.props.title || child.props.index), child.props.children)));
+  });
 
-  var _useState2 = useState(indexes[0]),
-      activeIndex = _useState2[0],
-      setActiveIndex = _useState2[1];
+  var _useState = useState(indexes[0]),
+      activeIndex = _useState[0],
+      setActiveIndex = _useState[1];
 
   useImperativeHandle(ref, function () {
     return {
@@ -53,10 +69,10 @@ export var IndexBar = /*#__PURE__*/forwardRef(function (p, ref) {
     var body = bodyRef.current;
     if (!body) return;
     var scrollTop = body.scrollTop;
-    var children = body.getElementsByClassName(classPrefix + "-anchor");
+    var elements = body.getElementsByClassName(classPrefix + "-anchor");
 
-    for (var i = 0; i < children.length; i++) {
-      var panel = children.item(i);
+    for (var i = 0; i < elements.length; i++) {
+      var panel = elements.item(i);
       if (!panel) continue;
       var panelIndex = panel.dataset['index'];
       if (!panelIndex) continue;
@@ -73,21 +89,8 @@ export var IndexBar = /*#__PURE__*/forwardRef(function (p, ref) {
   }),
       checkActiveIndex = _useThrottleFn.run;
 
-  useEffect(function () {
-    if (!indexes.length) return;
-    checkActiveIndex();
-  }, [indexes]);
-  var stickyStyle;
-
-  if (props.stickyOffsetTop) {
-    stickyStyle = {
-      '--sticy-offset-top': props.stickyOffsetTop + 'px'
-    };
-  }
-
-  var element = withNativeProps(props, /*#__PURE__*/React.createElement("div", {
-    className: classNames("" + classPrefix, (_classNames = {}, _classNames[classPrefix + "-sticky"] = props.sticky, _classNames)),
-    style: stickyStyle
+  return withNativeProps(props, /*#__PURE__*/React.createElement("div", {
+    className: classNames("" + classPrefix, (_classNames = {}, _classNames[classPrefix + "-sticky"] = props.sticky, _classNames))
   }, /*#__PURE__*/React.createElement(Sidebar, {
     indexes: indexes,
     activeIndex: activeIndex,
@@ -98,11 +101,5 @@ export var IndexBar = /*#__PURE__*/forwardRef(function (p, ref) {
     className: classPrefix + "-body",
     ref: bodyRef,
     onScroll: checkActiveIndex
-  }, props.children)));
-  return /*#__PURE__*/React.createElement(IndexBarContext.Provider, {
-    value: {
-      indexes: indexes,
-      setIndexes: setIndexes
-    }
-  }, element);
+  }, panels)));
 });

package/2x/es/components/index-bar/index.d.ts

@@ -2,11 +2,9 @@
 import './index-bar.less';
 export type { IndexBarProps, IndexBarRef } from './index-bar';
 declare const _default: import("react").ForwardRefExoticComponent<{
-    className?: string | undefined;
     sticky?: boolean | undefined;
-    stickyOffsetTop?: number | undefined;
     children?: import("react").ReactNode;
-} & import("../../utils/native-props").NativeProps<never> & import("react").RefAttributes<import("./index-bar").IndexBarRef>> & {
+} & import("../../utils/native-props").NativeProps<"--sticky-offset-top"> & import("react").RefAttributes<import("./index-bar").IndexBarRef>> & {
     Panel: import("react").FC<import("./panel").IndexBarAnchorProps>;
 };
 export default _default;

package/2x/es/components/index-bar/panel.d.ts

@@ -1,7 +1,7 @@
-import React from 'react';
+import { FC } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type IndexBarAnchorProps = {
     index: string;
     title?: string;
 } & NativeProps;
-export declare const Panel: React.FC<IndexBarAnchorProps>;
+export declare const Panel: FC<IndexBarAnchorProps>;

package/2x/es/components/index-bar/panel.js

@@ -1,27 +1,3 @@
-import React, { useContext, useEffect } from 'react';
-import { withNativeProps } from '../../utils/native-props';
-import { IndexBarContext } from './context';
-var classPrefix = "adm-index-bar-anchor";
-export var Panel = function Panel(props) {
-  var _useContext = useContext(IndexBarContext),
-      setIndexes = _useContext.setIndexes;
-
-  useEffect(function () {
-    setIndexes(function (val) {
-      return val.concat([props.index]);
-    });
-    return function () {
-      setIndexes(function (val) {
-        return val.filter(function (x) {
-          return x !== props.index;
-        });
-      });
-    };
-  }, [props.index]);
-  return withNativeProps(props, /*#__PURE__*/React.createElement("div", {
-    "data-index": props.index,
-    className: classPrefix
-  }, /*#__PURE__*/React.createElement("div", {
-    className: classPrefix + "-title"
-  }, props.title || props.index), props.children));
+export var Panel = function Panel() {
+  return null;
 };

package/2x/es/components/infinite-scroll/infinite-scroll.d.ts

@@ -1,8 +1,8 @@
-import React from 'react';
+import { FC } from 'react';
 import { NativeProps } from '../../utils/native-props';
 export declare type InfiniteScrollProps = {
     loadMore: () => Promise<void>;
     hasMore: boolean;
     threshold?: number;
 } & NativeProps;
-export declare const InfiniteScroll: React.FC<InfiniteScrollProps>;
+export declare const InfiniteScroll: FC<InfiniteScrollProps>;

package/2x/es/components/infinite-scroll/infinite-scroll.js

@@ -1,36 +1,4 @@
-var __awaiter = this && this.__awaiter || function (thisArg, _arguments, P, generator) {
-  function adopt(value) {
-    return value instanceof P ? value : new P(function (resolve) {
-      resolve(value);
-    });
-  }
-
-  return new (P || (P = Promise))(function (resolve, reject) {
-    function fulfilled(value) {
-      try {
-        step(generator.next(value));
-      } catch (e) {
-        reject(e);
-      }
-    }
-
-    function rejected(value) {
-      try {
-        step(generator["throw"](value));
-      } catch (e) {
-        reject(e);
-      }
-    }
-
-    function step(result) {
-      result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected);
-    }
-
-    step((generator = generator.apply(thisArg, _arguments || [])).next());
-  });
-};
-
-import { withDefaultProps } from '../../utils/with-default-props';
+import { mergeProps } from '../../utils/with-default-props';
 import React, { useEffect, useRef } from 'react';
 import { useLockFn, usePersistFn } from 'ahooks';
 import { withNativeProps } from '../../utils/native-props';
@@ -45,44 +13,35 @@ var classPrefix = "adm-infinite-scroll";
 
 var InfiniteScrollContent = function InfiniteScrollContent(_ref) {
   var hasMore = _ref.hasMore;
-  return /*#__PURE__*/React.createElement(React.Fragment, null, hasMore ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", null, "\u52A0\u8F7D\u4E2D"), /*#__PURE__*/React.createElement(Loading, {
-    size: 'small'
-  })) : /*#__PURE__*/React.createElement("span", null, "\u6CA1\u6709\u66F4\u591A\u4E86"));
+  return /*#__PURE__*/React.createElement(React.Fragment, null, hasMore ? /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("span", null, "\u52A0\u8F7D\u4E2D"), /*#__PURE__*/React.createElement(Loading, null)) : /*#__PURE__*/React.createElement("span", null, "\u6CA1\u6709\u66F4\u591A\u4E86"));
 };
 
-export var InfiniteScroll = withDefaultProps({
-  threshold: 250
-})(function (props) {
+export var InfiniteScroll = function InfiniteScroll(p) {
+  var props = mergeProps({
+    threshold: 250
+  }, p);
   var doLoadMore = useLockFn(function () {
-    return __awaiter(void 0, void 0, void 0, /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
-      return regeneratorRuntime.wrap(function _callee$(_context) {
-        while (1) {
-          switch (_context.prev = _context.next) {
-            case 0:
-              _context.next = 2;
-              return props.loadMore();
-
-            case 2:
-            case "end":
-              return _context.stop();
-          }
-        }
-      }, _callee);
-    }));
+    return props.loadMore();
   });
   var elementRef = useRef(null);
+  var checkTimeoutRef = useRef();
   var check = usePersistFn(function () {
-    if (!props.hasMore) return;
-    var element = elementRef.current;
-    if (!element) return;
-    var parent = getScrollParent(element);
-    if (!parent) return;
-    var elementTop = element.getBoundingClientRect().top;
-    var current = isWindow(parent) ? window.innerHeight : parent.getBoundingClientRect().bottom;
+    window.clearTimeout(checkTimeoutRef.current);
+    checkTimeoutRef.current = window.setTimeout(function () {
+      if (!props.hasMore) return;
+      var element = elementRef.current;
+      if (!element) return;
+      if (!element.offsetParent) return;
+      var parent = getScrollParent(element);
+      if (!parent) return;
+      var rect = element.getBoundingClientRect();
+      var elementTop = rect.top;
+      var current = isWindow(parent) ? window.innerHeight : parent.getBoundingClientRect().bottom;
 
-    if (current >= elementTop - props.threshold) {
-      doLoadMore();
-    }
+      if (current >= elementTop - props.threshold) {
+        doLoadMore();
+      }
+    });
   }); // 确保在内容不足时会自动触发加载事件
 
   useEffect(function () {
@@ -109,4 +68,4 @@ export var InfiniteScroll = withDefaultProps({
   }, props.children && props.children, !props.children && /*#__PURE__*/React.createElement(InfiniteScrollContent, {
     hasMore: props.hasMore
   })));
-});
+};

package/2x/es/components/input/input.css

@@ -3,6 +3,7 @@
   --color: var(--adm-color-text);
   --placeholder-color: var(--adm-color-light);
   --disabled-color: var(--adm-color-weak);
+  --text-align: left;
   display: flex;
   justify-content: flex-start;
   align-items: center;
@@ -28,6 +29,7 @@
   outline: none;
   appearance: none;
   min-height: 1.5em;
+  text-align: var(--text-align);
 }
 
 .adm-input::placeholder {
@@ -88,7 +90,7 @@
   cursor: pointer;
 }
 
-.adm-input-clear .anticon {
+.adm-input-clear .antd-mobile-icon {
   display: block;
   font-size: 28px;
 }

package/2x/es/components/input/input.d.ts

@@ -1,12 +1,7 @@
 import React from 'react';
 import { NativeProps } from '../../utils/native-props';
 declare type NativeInputProps = React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>;
-declare type EnterKeyHintProps = NativeInputProps extends {
-    enterKeyHint?: unknown;
-} ? {
-    enterKeyHint?: NativeInputProps['enterKeyHint'];
-} : {};
-export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'autoComplete' | 'pattern' | 'type' | 'onFocus' | 'onBlur' | 'autoCapitalize' | 'autoCorrect'> & EnterKeyHintProps & {
+export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'minLength' | 'max' | 'min' | 'autoComplete' | 'pattern' | 'type' | 'onFocus' | 'onBlur' | 'autoCapitalize' | 'autoCorrect' | 'onKeyDown' | 'onKeyUp'> & {
     value?: string;
     defaultValue?: string;
     onChange?: (val: string) => void;
@@ -16,15 +11,15 @@ export declare type InputProps = Pick<NativeInputProps, 'maxLength' | 'autoCompl
     clearable?: boolean;
     onClear?: () => void;
     id?: string;
-} & NativeProps<'--font-size' | '--color' | '--placeholder-color' | '--disabled-color'>;
+    onEnterPress?: (e: React.KeyboardEvent<HTMLInputElement>) => void;
+    enterKeyHint?: 'enter' | 'done' | 'go' | 'next' | 'previous' | 'search' | 'send';
+} & NativeProps<'--font-size' | '--color' | '--placeholder-color' | '--disabled-color' | '--text-align'>;
 export declare type InputRef = {
     clear: () => void;
     focus: () => void;
     blur: () => void;
 };
-export declare const Input: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "pattern" | "type" | "autoComplete" | "maxLength" | "autoCapitalize" | "autoCorrect" | "onFocus" | "onBlur"> & {
-    enterKeyHint?: React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>["enterKeyHint"] | undefined;
-} & {
+export declare const Input: React.ForwardRefExoticComponent<Pick<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "pattern" | "max" | "min" | "type" | "onFocus" | "onBlur" | "onKeyDown" | "onKeyUp" | "autoCapitalize" | "autoCorrect" | "autoComplete" | "maxLength" | "minLength"> & {
     value?: string | undefined;
     defaultValue?: string | undefined;
     onChange?: ((val: string) => void) | undefined;
@@ -34,5 +29,7 @@ export declare const Input: React.ForwardRefExoticComponent<Pick<React.DetailedH
     clearable?: boolean | undefined;
     onClear?: (() => void) | undefined;
     id?: string | undefined;
-} & NativeProps<"--font-size" | "--color" | "--placeholder-color" | "--disabled-color"> & React.RefAttributes<InputRef>>;
+    onEnterPress?: ((e: React.KeyboardEvent<HTMLInputElement>) => void) | undefined;
+    enterKeyHint?: "enter" | "search" | "done" | "go" | "next" | "previous" | "send" | undefined;
+} & NativeProps<"--font-size" | "--color" | "--placeholder-color" | "--disabled-color" | "--text-align"> & React.RefAttributes<InputRef>>;
 export {};