fix(ui): PasswordInput 眼睛移入输入框,隐藏 Edge 原生显隐按钮
- Input 新增 suffix 插槽,眼睛不再并排在外 - 隐藏 ::-ms-reveal / ::-ms-clear,避免 Edge 聚焦时出现两个眼睛 - 展示页补 suffix 示例;COMPONENTS.md / README 同步;版本 0.3.1
This commit is contained in:
@@ -1,5 +1,5 @@
|
||||
import { useState } from 'react'
|
||||
import { Button, FormField, Icon, Input, PasswordInput, Space, Text, Textarea } from '../../src'
|
||||
import { Button, FormField, Icon, IconButton, Input, PasswordInput, Space, Text, Textarea } from '../../src'
|
||||
import { Demo } from '../components/Demo'
|
||||
import { PropsTable } from '../components/PropsTable'
|
||||
import { Section } from '../components/Section'
|
||||
@@ -93,6 +93,30 @@ export function Inputs() {
|
||||
<Input size="lg" placeholder="大号 44(搜索框)" style={{ width: 320 }} />
|
||||
</Demo>
|
||||
|
||||
<Demo
|
||||
title="右侧插槽"
|
||||
desc="suffix 放在输入框内部右端,适合放复制、显隐、单位这类单个小动作;和 clearable 同用时排在清除按钮之前。"
|
||||
layout="column"
|
||||
code={`<Input
|
||||
placeholder="https://…"
|
||||
suffix={<IconButton label="复制" size="xs" icon={<Icon name="copy_line" />} />}
|
||||
/>`}
|
||||
>
|
||||
<Input
|
||||
value={host}
|
||||
onChange={(event) => setHost(event.target.value)}
|
||||
suffix={
|
||||
<IconButton
|
||||
label="复制"
|
||||
size="xs"
|
||||
icon={<Icon name="copy_line" />}
|
||||
onClick={() => void navigator.clipboard.writeText(host)}
|
||||
/>
|
||||
}
|
||||
style={{ width: 320 }}
|
||||
/>
|
||||
</Demo>
|
||||
|
||||
<Demo
|
||||
title="表单字段"
|
||||
desc="FormField 负责「标签 + 控件 + 提示/错误」的排版;校验逻辑留在页面,错误出现时自动 role=alert。"
|
||||
@@ -163,6 +187,7 @@ export function Inputs() {
|
||||
rows={[
|
||||
{ name: 'icon', type: 'IconName', desc: '左侧前缀图标' },
|
||||
{ name: 'size', type: "'sm' | 'md' | 'lg'", defaultValue: "'md'", desc: '32 / 36 / 44px' },
|
||||
{ name: 'suffix', type: 'ReactNode', desc: '右侧插槽(图标按钮、单位),排在清除按钮之前' },
|
||||
{ name: 'clearable', type: 'boolean', defaultValue: 'false', desc: '有内容时显示清除按钮' },
|
||||
{ name: 'onClear', type: '() => void', desc: '点击清除;不传则不显示按钮' },
|
||||
{ name: 'shortcut', type: 'string', desc: '右侧快捷键提示(仅展示)' },
|
||||
|
||||
Reference in New Issue
Block a user