TimeInput class

Optimized Time Input Text Field Component

A specialized text input widget for time entry that provides intuitive user experience with smart cursor positioning, automatic formatting, and robust focus management.

Key Features:

• Smart Cursor Positioning: Always places cursor where user taps, even after focus changes
• Dual Text Modes: Displays formatted time (HH:MM z/L) when unfocused, digits-only when focused
• Automatic Formatting: Converts user input to proper time format on focus loss
• Keyboard Navigation: Supports Enter (submit) and Escape (revert) keys
• Input Validation: Real-time validation with helpful error messages
• Performance Optimized: Uses cached regex patterns and efficient character code checks
• Timezone Display: Shows 'z' for UTC, 'L' for local (optional), or no suffix by default

Usage:

TimeInput(
  title: "Start Time",
  time: DateTime.now(),
  onSubmitted: (timeOfDay) => print("Selected: $timeOfDay"),
  onChanged: (timeOfDay) => print("Changed: $timeOfDay"), // Optional
  autoFocus: true, // Optional
  isUtc: false, // Use local time
  showLocalIndicator: true, // Show 'L' for local time
)

Behavior:

1. On Focus: Shows digits-only text (e.g., "1030" for 10:30)
2. On Blur: Shows formatted text (e.g., "10:30 z" for UTC, "10:30 ʟ" or "10:30" for local)
3. On Tap: Positions cursor at equivalent position in digits-only text
4. On Enter: Formats current input and submits
5. On Escape: Reverts to original value and submits

Technical Improvements:

• Enhanced cursor handling with proper position management
• Custom TextInputFormatter for consistent input formatting
• Reduced redundant formatting calls with cached regex patterns
• Simplified state management with efficient focus tracking
• Better focus event handling and cursor positioning
• Optimized performance with static regex patterns and character code checks
• Cleaner separation of concerns between input and display formatting