input update max length
This commit is contained in:
@@ -36,11 +36,18 @@ export function ProductCard({
|
||||
|
||||
const increase = (e: MouseEvent<HTMLButtonElement>) => {
|
||||
e.stopPropagation();
|
||||
setQuantity((q) => (q === '' ? 1 : q + 1));
|
||||
setQuantity((q) => {
|
||||
if (q === '' || q < 1) return 1;
|
||||
return q >= 999 ? 999 : q + 1;
|
||||
});
|
||||
};
|
||||
|
||||
const decrease = (e: MouseEvent<HTMLButtonElement>) => {
|
||||
setQuantity((q) => (q && q > 1 ? q - 1 : 0));
|
||||
e.stopPropagation();
|
||||
setQuantity((q) => {
|
||||
if (q === '' || q <= 1) return 1;
|
||||
return q - 1;
|
||||
});
|
||||
};
|
||||
|
||||
return (
|
||||
@@ -131,14 +138,24 @@ export function ProductCard({
|
||||
<Button size="icon" variant="ghost" onClick={decrease}>
|
||||
<Minus className="w-4 h-4" />
|
||||
</Button>
|
||||
|
||||
<Input
|
||||
value={quantity}
|
||||
onChange={(e) => {
|
||||
const v = e.target.value;
|
||||
if (/^\d*$/.test(v)) setQuantity(v === '' ? '' : +v);
|
||||
|
||||
if (!/^\d*$/.test(v)) return;
|
||||
|
||||
if (v === '') {
|
||||
setQuantity('');
|
||||
return;
|
||||
}
|
||||
|
||||
const num = Number(v);
|
||||
|
||||
setQuantity(num > 999 ? 999 : num);
|
||||
}}
|
||||
className="w-full border-none text-sm !p-0 focus-visible:ring-0"
|
||||
inputMode="numeric"
|
||||
className="w-full border-none text-center text-sm !p-0 focus-visible:ring-0"
|
||||
/>
|
||||
|
||||
<Button size="icon" variant="ghost" onClick={increase}>
|
||||
|
||||
Reference in New Issue
Block a user