Dockery/Trilium
1
0
Fork 0
mirror of https://github.com/zadam/trilium.git synced 2025-11-03 03:46:37 +01:00
Code Issues Packages Projects Releases Activity

fix(settings): max content width forces minimum when typing (closes #7423)

Browse Source
This commit is contained in:
Elian Doran
2025-10-20 18:34:57 +03:00
parent a664a58076
commit d4a46ed4da
2 changed files with 23 additions and 17 deletions
Download Patch File Download Diff File Expand all files Collapse all files

38
apps/client/src/widgets/react/FormTextBox.tsx
View File

@@ -9,22 +9,26 @@ interface FormTextBoxProps extends Omit<InputHTMLAttributes<HTMLInputElement>, "
}
export default function FormTextBox({ inputRef, className, type, currentValue, onChange, onBlur, autoFocus, ...rest}: FormTextBoxProps) {
if (type === "number" && currentValue) {
const { min, max } = rest;
const currentValueNum = parseInt(currentValue, 10);
if (min && currentValueNum < parseInt(String(min), 10)) {
currentValue = String(min);
} else if (max && currentValueNum > parseInt(String(max), 10)) {
currentValue = String(max);
}
}
useEffect(() => {
if (autoFocus) {
inputRef?.current?.focus();
}
}, []);
function applyLimits(value: string) {
if (type === "number") {
const { min, max } = rest;
const currentValueNum = parseInt(value, 10);
if (min && currentValueNum < parseInt(String(min), 10)) {
return String(min);
} else if (max && currentValueNum > parseInt(String(max), 10)) {
return String(max);
}
}
return value;
}
return (
<input
ref={inputRef}
@@ -33,11 +37,13 @@ export default function FormTextBox({ inputRef, className, type, currentValue, o
value={currentValue}
onInput={onChange && (e => {
const target = e.currentTarget;
onChange?.(target.value, target.validity);
const currentValue = applyLimits(e.currentTarget.value);
onChange?.(currentValue, target.validity);
})}
onBlur={onBlur && (e => {
const target = e.currentTarget;
onBlur(target.value);
onBlur={(e => {
const currentValue = applyLimits(e.currentTarget.value);
e.currentTarget.value = currentValue;
onBlur?.(currentValue);
})}
{...rest}
/>
@@ -49,6 +55,6 @@ export function FormTextBoxWithUnit(props: FormTextBoxProps & { unit: string })
<label class="input-group tn-number-unit-pair">
<FormTextBox {...props} />
<span class="input-group-text">{props.unit}</span>
</label>
</label>
)
}
}