fix: autofocus input from dialog no effect

assets/autofocus.less

@@ -0,0 +1,134 @@
+.rc-dialog {
+  position: relative;
+  width: auto;
+  margin: 10px;
+
+  &-wrap {
+    position: fixed;
+    overflow: auto;
+    top: 0;
+    right: 0;
+    bottom: 0;
+    left: 0;
+    z-index: 1050;
+    -webkit-overflow-scrolling: touch;
+    outline: 0;
+  }
+
+  &-title {
+    margin: 0;
+    font-size: 14px;
+    line-height: 21px;
+    font-weight: bold;
+  }
+
+  &-content {
+    position: relative;
+    background-color: #ffffff;
+    border: none;
+    border-radius: 6px 6px;
+    background-clip: padding-box;
+  }
+
+  &-close {
+    cursor: pointer;
+    border: 0;
+    background: transparent;
+    font-size: 21px;
+    position: absolute;
+    right: 20px;
+    top: 12px;
+    font-weight: 700;
+    line-height: 1;
+    color: #000;
+    text-shadow: 0 1px 0 #fff;
+    filter: alpha(opacity=20);
+    opacity: .2;
+    text-decoration: none;
+
+    &-x:after {
+      content: '×'
+    }
+
+    &:hover {
+      opacity: 1;
+      filter: alpha(opacity=100);
+      text-decoration: none;
+    }
+  }
+
+  &-header {
+    padding: 13px 20px 14px 20px;
+    border-radius: 5px 5px 0 0;
+    background: #fff;
+    color: #666;
+    border-bottom: 1px solid #e9e9e9;
+  }
+
+  &-body {
+    padding: 20px;
+  }
+
+  &-footer {
+    border-top: 1px solid #e9e9e9;
+    padding: 10px 20px;
+    text-align: right;
+    border-radius: 0 0 5px 5px;
+  }
+
+  .effect() {
+    animation-duration: 0.3s;
+    animation-fill-mode: both;
+  }
+
+  &-zoom-enter, &-zoom-appear {
+    opacity: 0;
+    .effect();
+    animation-timing-function: cubic-bezier(0.08, 0.82, 0.17, 1);
+    animation-play-state: paused;
+  }
+
+  &-zoom-leave {
+    .effect();
+    animation-timing-function: cubic-bezier(0.6, 0.04, 0.98, 0.34);
+    animation-play-state: paused;
+  }
+
+  &-zoom-enter&-zoom-enter-active, &-zoom-appear&-zoom-appear-active {
+    animation-name: rcDialogZoomIn;
+    animation-play-state: running;
+  }
+
+  &-zoom-leave&-zoom-leave-active {
+    animation-name: rcDialogZoomOut;
+    animation-play-state: running;
+  }
+
+  @keyframes rcDialogZoomIn {
+    0% {
+      opacity: 0;
+      transform: scale(0, 0);
+    }
+    100% {
+      opacity: 1;
+      transform: scale(1, 1);
+    }
+  }
+  @keyframes rcDialogZoomOut {
+    0% {
+
+      transform: scale(1, 1);
+    }
+    100% {
+      opacity: 0;
+      transform: scale(0, 0);
+    }
+  }
+}
+
+@media (min-width: 768px) {
+  .rc-dialog {
+    width: 600px;
+    margin: 30px auto;
+  }
+}

assets/index.less

@@ -30,3 +30,4 @@
     }
   }
 }
+@import './autofocus.less';

docs/demo/autofocus.md

@@ -0,0 +1,8 @@
+---
+title: AutoFocus
+nav:
+  title: Demo
+  path: /demo
+---
+
+<code src="../examples/autofocus.tsx"></code>

docs/examples/autofocus.tsx

@@ -0,0 +1,31 @@
+import Dialog from 'rc-dialog';
+import Input from 'rc-input';
+import type { FC } from 'react';
+import React from 'react';
+import '../../assets/index.less';
+
+const Demo: FC = () => {
+  const [vis, setVis] = React.useState(false);
+  return (
+    <div>
+      normal:
+      <Input placeholder="input" autoFocus />
+      <br />
+      <br />
+      dialog:
+      <button onClick={() => setVis((pre) => !pre)}>
+        toggle autoFocus input{' '}
+      </button>
+      <Dialog
+        visible={vis}
+        onClose={() => setVis(false)}
+        style={{ width: 600 }}
+        title={<div>第二个弹框</div>}
+      >
+        <Input placeholder="input" autoFocus />
+      </Dialog>
+    </div>
+  );
+};
+
+export default Demo;

package.json

@@ -69,6 +69,7 @@
     "np": "^7.0.0",
     "prettier": "^2.0.5",
     "pretty-quick": "^3.0.0",
+    "rc-dialog": "^9.1.0",
     "rc-test": "^7.0.15",
     "react": "^18.0.0",
     "react-dom": "^18.0.0",

src/Input.tsx

@@ -99,6 +99,12 @@
     }
     setFocused((prev) => (prev && disabled ? false : prev));
   }, [disabled]);
+
+  useEffect(() => {
+    if (rest.autoFocus) {
+      focus();
+    }
+  }, [rest.autoFocus]);
 
   const triggerChange = (
     e: