chore(design): Add password, showCount and allowClear demo for Input

packages/design/src/input/demo/allowClear.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import { Input, Space } from '@oceanbase/design';
+
+const { TextArea } = Input;
+
+const onChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
+  console.log(e);
+};
+
+const App: React.FC = () => (
+  <Space direction="vertical" style={{ width: '100%' }}>
+    <Input defaultValue="Input with clear icon" allowClear onChange={onChange} />
+    <TextArea defaultValue="TextArea with clear icon" allowClear onChange={onChange} />
+  </Space>
+);
+
+export default App;

packages/design/src/input/demo/password.tsx

@@ -0,0 +1,16 @@
+import React from 'react';
+import { Input, Space } from 'antd';
+
+const App: React.FC = () => {
+  return (
+    <Space direction="vertical" style={{ width: '100%' }}>
+      <Input.Password placeholder="auto fill password by default" />
+      <Input.Password
+        autoComplete="new-password"
+        placeholder='not auto fill password with autoComplete="new-password"'
+      />
+    </Space>
+  );
+};
+
+export default App;

packages/design/src/input/demo/showCount.tsx

@@ -0,0 +1,17 @@
+import React from 'react';
+import { Input, Space } from '@oceanbase/design';
+
+const { TextArea } = Input;
+
+const onChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => {
+  console.log('Change:', e.target.value);
+};
+
+const App: React.FC = () => (
+  <Space direction="vertical" style={{ width: '100%' }}>
+    <Input showCount maxLength={20} onChange={onChange} />
+    <TextArea showCount maxLength={100} onChange={onChange} />
+  </Space>
+);
+
+export default App;

packages/design/src/input/index.md

@@ -16,6 +16,9 @@ demo:
 <!-- prettier-ignore -->
 <code src="./demo/basic.tsx" title="基本使用" description="默认填充 `placeholder`"></code>
 <code src="./demo/search.tsx" title="搜索框"></code>
+<code src="./demo/password.tsx" title="密码输入框" description='设置 `autoComplete="new-password"` 可避免自动填充密码，详见 [MDN 文档](https://developer.mozilla.org/zh-CN/docs/Web/HTML/Attributes/autocomplete)。'></code>
+<code src="./demo/showCount.tsx" title="字数提示" description="超出字数长度后无法输入"></code>
+<code src="./demo/allowClear.tsx" title="清除图标" description="用于一键清除输入内容"></code>
 
 ## API