fix(time-picker): period switching on hour change from keyboard navigation (#194)

* fix(time-picker): preserve period when navigating hour column

- Fixed bug where PM/AM period would switch to AM when navigating hours with arrow keys or clicking hours in dropdown
- Period now properly derives from existing 24-hour value instead of always defaulting to AM
- When no value exists, defaults to current time's period for better UX
- Matches native HTML time input behavior

* chore: rebuild registry

Author: sadmann7

docs/public/r/styles/default/time-picker.json

@@ -718,10 +718,11 @@ function TimePickerInput(props: TimePickerInputProps) {
       case "second":
         if (timeValue.second === undefined) return segmentPlaceholder.second;
         return timeValue.second.toString().padStart(2, "0");
-      case "period":
+      case "period": {
         if (!timeValue || timeValue.hour === undefined)
           return segmentPlaceholder.period;
         return to12Hour(timeValue.hour).period;
+      }
       default:
         return "";
     }
@@ -755,8 +756,17 @@ function TimePickerInput(props: TimePickerInputProps) {
           if (!Number.isNaN(displayHour)) {
             if (is12Hour) {
               const clampedHour = clamp(displayHour, 1, 12);
-              const currentPeriod = timeValue?.period || "AM";
-              newTime.hour = to24Hour(clampedHour, currentPeriod);
+              let currentPeriod: Period;
+              if (timeValue?.period !== undefined) {
+                currentPeriod = timeValue.period;
+              } else if (timeValue?.hour !== undefined) {
+                currentPeriod = to12Hour(timeValue.hour).period;
+              } else {
+                const now = new Date();
+                currentPeriod = to12Hour(now.getHours()).period;
+              }
+              const hour24 = to24Hour(clampedHour, currentPeriod);
+              newTime.hour = hour24;
               if (timeValue?.period !== undefined) {
                 newTime.period = timeValue.period;
               }
@@ -1711,7 +1721,14 @@ function TimePickerHour(props: TimePickerHourProps) {
 
       let hour24 = displayHour;
       if (is12Hour) {
-        const currentPeriod = timeValue?.period || "AM";
+        let currentPeriod: Period;
+        if (timeValue?.period !== undefined) {
+          currentPeriod = timeValue.period;
+        } else if (timeValue?.hour !== undefined) {
+          currentPeriod = to12Hour(timeValue.hour).period;
+        } else {
+          currentPeriod = to12Hour(now.getHours()).period;
+        }
         hour24 = to24Hour(displayHour, currentPeriod);
       }