Update number inupt max/min value now disables +/- buttons respectively

src/components/ui/form-numeric-input.tsx

@@ -128,6 +128,18 @@ const FormNumericInput = React.forwardRef<HTMLInputElement, NumericInputProps>(
     const handleKeyDown = (e: React.KeyboardEvent<HTMLInputElement>) => {
       if (e.key === 'ArrowUp' || e.key === 'ArrowDown') {
         e.preventDefault()
+
+        // Check if we're at min/max before allowing arrow key navigation
+        const numValue = Number(value)
+        const hasValidNumber = !isNaN(numValue) && value !== ''
+
+        if (e.key === 'ArrowDown' && hasValidNumber && numValue <= min) {
+          return // Don't decrement if at min
+        }
+        if (e.key === 'ArrowUp' && hasValidNumber && numValue >= max) {
+          return // Don't increment if at max
+        }
+
         updateValue(e.key === 'ArrowUp' ? 1 : -1)
       }
     }
@@ -179,6 +191,12 @@ const FormNumericInput = React.forwardRef<HTMLInputElement, NumericInputProps>(
       }
     }
 
+    // Determine if buttons should be disabled based on current value and min/max
+    const numValue = Number(value)
+    const hasValidNumber = !isNaN(numValue) && value !== ''
+    const isAtMin = hasValidNumber && numValue <= min
+    const isAtMax = hasValidNumber && numValue >= max
+
     return (
       <div ref={containerRef} className={cn("relative flex items-center gap-2", className)}>
         <div className="flex items-center">
@@ -192,6 +210,7 @@ const FormNumericInput = React.forwardRef<HTMLInputElement, NumericInputProps>(
               hasWarning && !hasError && "border-yellow-500"
             )}
             onClick={() => updateValue(-1)}
+            disabled={isAtMin}
             tabIndex={-1}
           >
             <Minus className="h-4 w-4" />
@@ -224,6 +243,7 @@ const FormNumericInput = React.forwardRef<HTMLInputElement, NumericInputProps>(
               hasWarning && !hasError && "border-yellow-500"
             )}
             onClick={() => updateValue(1)}
+            disabled={isAtMax}
             tabIndex={-1}
           >
             <Plus className="h-4 w-4" />