@hero-design/rn 8.112.0 → 8.112.1

package/.turbo/turbo-build.log

@@ -1,4 +1,4 @@
-(node:2673) ExperimentalWarning: Importing JSON modules is an experimental feature and might change at any time
+(node:2743) ExperimentalWarning: Importing JSON modules is an experimental feature and might change at any time
 (Use `node --trace-warnings ...` to show where the warning was created)
 
 src/index.ts → lib/index.js, es/index.js...
@@ -9,9 +9,9 @@ node_modules/d3-selection/src/selection/index.js -> node_modules/d3-selection/sr
 ...and 12 more
 (!) [plugin replace] @rollup/plugin-replace: 'preventAssignment' currently defaults to false. It is recommended to set this option to `true`, as the next major version will default this option to `true`.
 (!) [plugin node-resolve] preferring built-in module 'events' over local alternative at '/home/runner/_work/hero-design/hero-design/node_modules/events/events.js', pass 'preferBuiltins: false' to disable this behavior or 'preferBuiltins: true' to disable this warning.or passing a function to 'preferBuiltins' to provide more fine-grained control over which built-in modules to prefer.
-created lib/index.js, es/index.js in 1m 36.5s
+created lib/index.js, es/index.js in 1m 34.7s
 
 /home/runner/_work/hero-design/hero-design/packages/rn/src/locales/en_AU.ts, /home/runner/_work/hero-design/hero-design/packages/rn/src/locales/en_CA.ts, /home/runner/_work/hero-design/hero-design/packages/rn/src/locales/index.ts, /home/runner/_work/hero-design/hero-design/packages/rn/src/locales/types.ts → ., ....
 (!) Generated empty chunks
 "locales/types" and "locales/types"
-created ., . in 29.5s
+created ., . in 25.3s

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @hero-design/rn
 
+## 8.112.1
+
+### Patch Changes
+
+- [#4310](https://github.com/Thinkei/hero-design/pull/4310) [`4742897580f05ae3d5f089df7aa0b1a34a90e15c`](https://github.com/Thinkei/hero-design/commit/4742897580f05ae3d5f089df7aa0b1a34a90e15c) Thanks [@vinhphan-eh](https://github.com/vinhphan-eh)! - [TimePicker] Correct 12-hour format for iOS picker
+
 ## 8.112.0
 
 ### Minor Changes

package/es/index.js

@@ -27958,6 +27958,10 @@ var TimePickerIOS = function TimePickerIOS(_ref) {
   var is12Hour = displayFormat.includes('hh');
   var displayValue = value ? formatTime(displayFormat, value) : '';
   var theme = useTheme();
+  // Determine locale based on time format preference
+  // For 12-hour format: use en-US locale to ensure 12-hour display regardless of device settings
+  // For 24-hour format: use en-GB for consistent 24-hour display
+  var pickerLocale = is12Hour ? 'en-US' : 'en-GB';
   var InputComponent = TextInputComponent || TextInput;
   useEffect(function () {
     setSelectingDate(value || new Date());
@@ -28005,11 +28009,8 @@ var TimePickerIOS = function TimePickerIOS(_ref) {
   }, /*#__PURE__*/React__default.createElement(StyledPickerWrapper, null, /*#__PURE__*/React__default.createElement(DateTimePicker, {
     testID: "timePickerIOS",
     value: selectingDate,
-    mode: "time"
-    // Current prop is24Hour config only available for Android.
-    // This is a work around to get the picker to display 24 hour format for iOS.
-    ,
-    locale: is12Hour ? undefined : 'en-GB',
+    mode: "time",
+    locale: pickerLocale,
     onChange: function onChange(_, date) {
       if (date) {
         setSelectingDate(date);

package/lib/index.js

@@ -27987,6 +27987,10 @@ var TimePickerIOS = function TimePickerIOS(_ref) {
   var is12Hour = displayFormat.includes('hh');
   var displayValue = value ? formatTime(displayFormat, value) : '';
   var theme = useTheme();
+  // Determine locale based on time format preference
+  // For 12-hour format: use en-US locale to ensure 12-hour display regardless of device settings
+  // For 24-hour format: use en-GB for consistent 24-hour display
+  var pickerLocale = is12Hour ? 'en-US' : 'en-GB';
   var InputComponent = TextInputComponent || TextInput;
   React.useEffect(function () {
     setSelectingDate(value || new Date());
@@ -28034,11 +28038,8 @@ var TimePickerIOS = function TimePickerIOS(_ref) {
   }, /*#__PURE__*/React__namespace.default.createElement(StyledPickerWrapper, null, /*#__PURE__*/React__namespace.default.createElement(DateTimePicker__default.default, {
     testID: "timePickerIOS",
     value: selectingDate,
-    mode: "time"
-    // Current prop is24Hour config only available for Android.
-    // This is a work around to get the picker to display 24 hour format for iOS.
-    ,
-    locale: is12Hour ? undefined : 'en-GB',
+    mode: "time",
+    locale: pickerLocale,
     onChange: function onChange(_, date) {
       if (date) {
         setSelectingDate(date);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hero-design/rn",
-  "version": "8.112.0",
+  "version": "8.112.1",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",

package/src/components/TimePicker/TimePickerIOS.tsx

@@ -39,6 +39,11 @@ const TimePickerIOS = ({
   const displayValue = value ? formatTime(displayFormat, value) : '';
   const theme = useTheme();
 
+  // Determine locale based on time format preference
+  // For 12-hour format: use en-US locale to ensure 12-hour display regardless of device settings
+  // For 24-hour format: use en-GB for consistent 24-hour display
+  const pickerLocale = is12Hour ? 'en-US' : 'en-GB';
+
   const InputComponent = TextInputComponent || TextInput;
 
   useEffect(() => {
@@ -95,9 +100,7 @@ const TimePickerIOS = ({
             testID="timePickerIOS"
             value={selectingDate}
             mode="time"
-            // Current prop is24Hour config only available for Android.
-            // This is a work around to get the picker to display 24 hour format for iOS.
-            locale={is12Hour ? undefined : 'en-GB'}
+            locale={pickerLocale}
             onChange={(_: any, date: Date | undefined) => {
               if (date) {
                 setSelectingDate(date);

package/src/components/TimePicker/__tests__/__snapshots__/TimePickerIOS.spec.tsx.snap

@@ -834,6 +834,7 @@ exports[`TimePickerIOS renders correctly 1`] = `
                   >
                     <Picker
                       display="spinner"
+                      locale="en-US"
                       mode="time"
                       onChange={[Function]}
                       style={