wider velocity threshold input, shows Auto when zero

This commit is contained in:
2026-03-22 09:25:26 +02:00
parent 086d4b9a10
commit 2b42b2ca09
2 changed files with 8 additions and 3 deletions

View File

@@ -73,6 +73,7 @@ export default function NumberInput({
max = 999, max = 999,
step = 1, step = 1,
style, style,
placeholder,
'aria-label': ariaLabel, 'aria-label': ariaLabel,
}: { }: {
value: number value: number
@@ -81,6 +82,7 @@ export default function NumberInput({
max?: number max?: number
step?: number step?: number
style?: React.CSSProperties style?: React.CSSProperties
placeholder?: string
'aria-label'?: string 'aria-label'?: string
}) { }) {
const valueRef = useRef(value) const valueRef = useRef(value)
@@ -113,16 +115,18 @@ export default function NumberInput({
<input <input
type="text" type="text"
inputMode="numeric" inputMode="numeric"
value={value} value={value === 0 && placeholder ? '' : value}
placeholder={placeholder}
aria-label={ariaLabel} aria-label={ariaLabel}
onChange={(e) => { onChange={(e) => {
if (e.target.value === '') { onChange(0); return }
const n = parseInt(e.target.value) const n = parseInt(e.target.value)
if (!isNaN(n)) onChange(clamp(n)) if (!isNaN(n)) onChange(clamp(n))
}} }}
style={{ style={{
flex: 1, flex: 1,
minWidth: 0, minWidth: 0,
padding: '8px 4px', padding: '8px 8px',
background: 'transparent', background: 'transparent',
border: 'none', border: 'none',
outline: 'none', outline: 'none',

View File

@@ -727,7 +727,7 @@ function BoardSecurityCard({ board, selected, onToggleSelect }: { board: BoardSu
aria-label="Sensitivity level" aria-label="Sensitivity level"
/> />
</div> </div>
<div style={{ width: 100 }}> <div style={{ minWidth: 140 }}>
<label style={{ display: 'block', color: 'var(--text-tertiary)', fontSize: 'var(--text-xs)', marginBottom: 4 }}> <label style={{ display: 'block', color: 'var(--text-tertiary)', fontSize: 'var(--text-xs)', marginBottom: 4 }}>
Velocity threshold Velocity threshold
</label> </label>
@@ -737,6 +737,7 @@ function BoardSecurityCard({ board, selected, onToggleSelect }: { board: BoardSu
min={0} min={0}
max={1000} max={1000}
step={5} step={5}
placeholder="Auto"
/> />
</div> </div>
<label <label