@hero-design/rn 8.103.6 → 8.103.7

package/.turbo/turbo-build.log

@@ -1,4 +1,4 @@
-(node:3296) ExperimentalWarning: Importing JSON modules is an experimental feature and might change at any time
+(node:3293) 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...
@@ -15,9 +15,9 @@ node_modules/d3-selection/src/selection/index.js -> node_modules/d3-selection/sr
                                      ~~~~~~~~~~~~~~~~~~~
 
 (!) [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 9.6s
+created lib/index.js, es/index.js in 1m 13.2s
 
 /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 18.8s
+created ., . in 20s

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @hero-design/rn
 
+## 8.103.7
+
+### Patch Changes
+
+- [#4080](https://github.com/Thinkei/hero-design/pull/4080) [`920325f82fa122dee579f6b5c86fbea1f5207416`](https://github.com/Thinkei/hero-design/commit/920325f82fa122dee579f6b5c86fbea1f5207416) Thanks [@vinhphan-eh](https://github.com/vinhphan-eh)! - [DatePicker][timepicker] Add inputProps and groupStyleEnabled internal props for group style
+
 ## 8.103.6
 
 ### Patch Changes

package/es/index.js

@@ -20415,6 +20415,30 @@ var useFormatDate = function useFormatDate(_ref) {
   };
 };
 
+var StyledPickerWrapper$1 = index$b(View)(function (_ref) {
+  var theme = _ref.theme;
+  return {
+    height: theme.__hd__.datePicker.sizes.height,
+    alignItems: 'center'
+  };
+});
+var getZIndexByState$2 = function getZIndexByState(_ref2) {
+  var themeHasError = _ref2.themeHasError;
+  if (themeHasError) {
+    return 1;
+  }
+  return 0;
+};
+var StyledTouchableOpacity$2 = index$b(TouchableOpacity)(function (_ref3) {
+  var themeGroupStyleEnabled = _ref3.themeGroupStyleEnabled,
+    themeHasError = _ref3.themeHasError;
+  return _objectSpread2({}, themeGroupStyleEnabled && {
+    zIndex: getZIndexByState$2({
+      themeHasError: themeHasError
+    })
+  });
+});
+
 var DatePickerAndroid = function DatePickerAndroid(_ref) {
   var value = _ref.value,
     minDate = _ref.minDate,
@@ -20434,7 +20458,10 @@ var DatePickerAndroid = function DatePickerAndroid(_ref) {
     variant = _ref$variant === void 0 ? 'default' : _ref$variant,
     renderSelectedValue = _ref.renderSelectedValue,
     locale = _ref.locale,
-    TextInputComponent = _ref.TextInputComponent;
+    TextInputComponent = _ref.TextInputComponent,
+    inputProps = _ref.inputProps,
+    _ref$groupStyleEnable = _ref.groupStyleEnabled,
+    groupStyleEnabled = _ref$groupStyleEnable === void 0 ? false : _ref$groupStyleEnable;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     open = _useState2[0],
@@ -20453,15 +20480,19 @@ var DatePickerAndroid = function DatePickerAndroid(_ref) {
     value: value
   });
   var InputComponent = TextInputComponent || TextInput;
-  return /*#__PURE__*/React__default.createElement(TouchableOpacity, {
-    onPress: function onPress() {
-      return setOpen(true);
-    },
-    disabled: disabled
+  var onPress = useCallback(function () {
+    setOpen(true);
+  }, []);
+  return /*#__PURE__*/React__default.createElement(StyledTouchableOpacity$2, {
+    onPress: onPress,
+    disabled: disabled,
+    themeGroupStyleEnabled: groupStyleEnabled,
+    themeHasError: !!error,
+    testID: "date-picker-android-touchable-opacity"
   }, /*#__PURE__*/React__default.createElement(View, {
     pointerEvents: "none",
     testID: "datePickerInputAndroid"
-  }, /*#__PURE__*/React__default.createElement(InputComponent, {
+  }, /*#__PURE__*/React__default.createElement(InputComponent, _extends$1({}, inputProps, {
     label: label,
     value: displayValue,
     suffix: "calendar-dates-outlined",
@@ -20478,7 +20509,7 @@ var DatePickerAndroid = function DatePickerAndroid(_ref) {
         formattedDateString: displayValue
       }, props);
     } : undefined
-  })), /*#__PURE__*/React__default.createElement(AndroidDatePickerDialog, {
+  }))), /*#__PURE__*/React__default.createElement(AndroidDatePickerDialog, {
     open: open,
     onClose: function onClose() {
       return setOpen(false);
@@ -20557,7 +20588,10 @@ var DatePickerCalendar = function DatePickerCalendar(_ref2) {
     supportedOrientations = _ref2$supportedOrient === void 0 ? ['portrait'] : _ref2$supportedOrient,
     renderSelectedValue = _ref2.renderSelectedValue,
     locale = _ref2.locale,
-    TextInputComponent = _ref2.TextInputComponent;
+    TextInputComponent = _ref2.TextInputComponent,
+    inputProps = _ref2.inputProps,
+    _ref2$groupStyleEnabl = _ref2.groupStyleEnabled,
+    groupStyleEnabled = _ref2$groupStyleEnabl === void 0 ? false : _ref2$groupStyleEnabl;
   var _useState5 = useState(false),
     _useState6 = _slicedToArray(_useState5, 2),
     open = _useState6[0],
@@ -20584,15 +20618,19 @@ var DatePickerCalendar = function DatePickerCalendar(_ref2) {
     value: value
   });
   var InputComponent = TextInputComponent || TextInput;
-  return /*#__PURE__*/React__default.createElement(TouchableOpacity, {
-    onPress: function onPress() {
-      return setOpen(true);
-    },
-    disabled: disabled
+  var onPress = useCallback(function () {
+    setOpen(true);
+  }, []);
+  return /*#__PURE__*/React__default.createElement(StyledTouchableOpacity$2, {
+    onPress: onPress,
+    disabled: disabled,
+    themeGroupStyleEnabled: groupStyleEnabled,
+    themeHasError: !!error,
+    testID: "date-picker-calendar-touchable-opacity"
   }, /*#__PURE__*/React__default.createElement(View, {
     pointerEvents: "none",
     testID: "datePickerCalendar"
-  }, /*#__PURE__*/React__default.createElement(InputComponent, {
+  }, /*#__PURE__*/React__default.createElement(InputComponent, _extends$1({}, inputProps, {
     label: label,
     value: displayValue,
     suffix: "calendar-dates-outlined",
@@ -20609,7 +20647,7 @@ var DatePickerCalendar = function DatePickerCalendar(_ref2) {
         formattedDateString: displayValue
       }, props);
     } : undefined
-  })), /*#__PURE__*/React__default.createElement(BottomSheet$1, {
+  }))), /*#__PURE__*/React__default.createElement(BottomSheet$1, {
     open: open,
     onRequestClose: function onRequestClose() {
       return setOpen(false);
@@ -20639,14 +20677,6 @@ var DatePickerCalendar = function DatePickerCalendar(_ref2) {
   }))));
 };
 
-var StyledPickerWrapper$1 = index$b(View)(function (_ref) {
-  var theme = _ref.theme;
-  return {
-    height: theme.__hd__.datePicker.sizes.height,
-    alignItems: 'center'
-  };
-});
-
 var IOSDatePickerDialog = function IOSDatePickerDialog(_ref) {
   var label = _ref.label,
     open = _ref.open,
@@ -20740,7 +20770,10 @@ var DatePickerIOS = function DatePickerIOS(_ref) {
     variant = _ref$variant === void 0 ? 'default' : _ref$variant,
     locale = _ref.locale,
     renderSelectedValue = _ref.renderSelectedValue,
-    TextInputComponent = _ref.TextInputComponent;
+    TextInputComponent = _ref.TextInputComponent,
+    inputProps = _ref.inputProps,
+    _ref$groupStyleEnable = _ref.groupStyleEnabled,
+    groupStyleEnabled = _ref$groupStyleEnable === void 0 ? false : _ref$groupStyleEnable;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     open = _useState2[0],
@@ -20761,15 +20794,19 @@ var DatePickerIOS = function DatePickerIOS(_ref) {
     value: value
   });
   var InputComponent = TextInputComponent || TextInput;
-  return /*#__PURE__*/React__default.createElement(TouchableOpacity, {
-    onPress: function onPress() {
-      return setOpen(true);
-    },
-    disabled: disabled
+  var onPress = useCallback(function () {
+    setOpen(true);
+  }, []);
+  return /*#__PURE__*/React__default.createElement(StyledTouchableOpacity$2, {
+    onPress: onPress,
+    disabled: disabled,
+    themeGroupStyleEnabled: groupStyleEnabled,
+    themeHasError: !!error,
+    testID: "date-picker-ios-touchable-opacity"
   }, /*#__PURE__*/React__default.createElement(View, {
     pointerEvents: "none",
     testID: "datePickerInputIOS"
-  }, /*#__PURE__*/React__default.createElement(InputComponent, {
+  }, /*#__PURE__*/React__default.createElement(InputComponent, _extends$1({}, inputProps, {
     label: label,
     value: displayValue,
     suffix: "calendar-dates-outlined",
@@ -20786,7 +20823,7 @@ var DatePickerIOS = function DatePickerIOS(_ref) {
         formattedDateString: displayValue
       }, props);
     } : undefined
-  })), /*#__PURE__*/React__default.createElement(IOSDatePickerDialog, {
+  }))), /*#__PURE__*/React__default.createElement(IOSDatePickerDialog, {
     value: value,
     onChange: onChange,
     open: open,
@@ -24923,18 +24960,18 @@ var StyledSectionList = index$b(SectionList)(function (_ref4) {
     paddingHorizontal: theme.__hd__.select.space.optionListHorizontalPadding
   };
 });
-var getZIndexByState = function getZIndexByState(_ref5) {
+var getZIndexByState$1 = function getZIndexByState(_ref5) {
   var themeHasError = _ref5.themeHasError;
   if (themeHasError) {
     return 1;
   }
   return 0;
 };
-var StyledTouchableOpacity = index$b(TouchableOpacity)(function (_ref6) {
+var StyledTouchableOpacity$1 = index$b(TouchableOpacity)(function (_ref6) {
   var themeGroupStyleEnabled = _ref6.themeGroupStyleEnabled,
     themeHasError = _ref6.themeHasError;
   return _objectSpread2({}, themeGroupStyleEnabled && {
-    zIndex: getZIndexByState({
+    zIndex: getZIndexByState$1({
       themeHasError: themeHasError
     })
   });
@@ -25139,7 +25176,7 @@ function MultiSelect(_ref) {
   }, [open, value]);
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(View, {
     pointerEvents: !editable || disabled || inputProps !== null && inputProps !== void 0 && inputProps.loading ? 'none' : 'auto'
-  }, /*#__PURE__*/React__default.createElement(StyledTouchableOpacity, {
+  }, /*#__PURE__*/React__default.createElement(StyledTouchableOpacity$1, {
     onPress: onPress,
     themeGroupStyleEnabled: groupStyleEnabled,
     themeHasError: !!error,
@@ -25347,7 +25384,7 @@ var SingleSelect = function SingleSelect(_ref) {
   }, []);
   return /*#__PURE__*/React__default.createElement(React__default.Fragment, null, /*#__PURE__*/React__default.createElement(View, {
     pointerEvents: !editable || disabled || inputProps !== null && inputProps !== void 0 && inputProps.loading ? 'none' : 'auto'
-  }, /*#__PURE__*/React__default.createElement(StyledTouchableOpacity, {
+  }, /*#__PURE__*/React__default.createElement(StyledTouchableOpacity$1, {
     onPress: onPress,
     themeGroupStyleEnabled: groupStyleEnabled,
     themeHasError: !!error,
@@ -26694,6 +26731,30 @@ var Tag = function Tag(_ref) {
   }, content) : content);
 };
 
+var StyledPickerWrapper = index$b(View)(function (_ref) {
+  var theme = _ref.theme;
+  return {
+    height: theme.__hd__.timePicker.sizes.height,
+    alignItems: 'center'
+  };
+});
+var getZIndexByState = function getZIndexByState(_ref2) {
+  var themeHasError = _ref2.themeHasError;
+  if (themeHasError) {
+    return 1;
+  }
+  return 0;
+};
+var StyledTouchableOpacity = index$b(TouchableOpacity)(function (_ref3) {
+  var themeGroupStyleEnabled = _ref3.themeGroupStyleEnabled,
+    themeHasError = _ref3.themeHasError;
+  return _objectSpread2({}, themeGroupStyleEnabled && {
+    zIndex: getZIndexByState({
+      themeHasError: themeHasError
+    })
+  });
+});
+
 var TimePickerAndroid = function TimePickerAndroid(_ref) {
   var value = _ref.value,
     label = _ref.label,
@@ -26710,7 +26771,10 @@ var TimePickerAndroid = function TimePickerAndroid(_ref) {
     testID = _ref.testID,
     _ref$showSuffix = _ref.showSuffix,
     showSuffix = _ref$showSuffix === void 0 ? true : _ref$showSuffix,
-    TextInputComponent = _ref.TextInputComponent;
+    TextInputComponent = _ref.TextInputComponent,
+    inputProps = _ref.inputProps,
+    _ref$groupStyleEnable = _ref.groupStyleEnabled,
+    groupStyleEnabled = _ref$groupStyleEnable === void 0 ? false : _ref$groupStyleEnable;
   var _useState = useState(false),
     _useState2 = _slicedToArray(_useState, 2),
     open = _useState2[0],
@@ -26719,15 +26783,19 @@ var TimePickerAndroid = function TimePickerAndroid(_ref) {
   var displayValue = value ? formatTime(displayFormat, value) : '';
   var pickerInitValue = value || new Date();
   var InputComponent = TextInputComponent || TextInput;
-  return /*#__PURE__*/React__default.createElement(TouchableOpacity, {
-    onPress: function onPress() {
-      return setOpen(true);
-    },
-    disabled: disabled
+  var onPress = useCallback(function () {
+    setOpen(true);
+  }, []);
+  return /*#__PURE__*/React__default.createElement(StyledTouchableOpacity, {
+    onPress: onPress,
+    disabled: disabled,
+    themeGroupStyleEnabled: groupStyleEnabled,
+    themeHasError: !!error,
+    testID: "time-picker-android-touchable-opacity"
   }, /*#__PURE__*/React__default.createElement(View, {
     pointerEvents: "none",
     testID: "timePickerInputAndroid"
-  }, /*#__PURE__*/React__default.createElement(InputComponent, {
+  }, /*#__PURE__*/React__default.createElement(InputComponent, _extends$1({}, inputProps, {
     label: label,
     value: displayValue,
     suffix: showSuffix ? 'clock-3' : undefined,
@@ -26738,7 +26806,7 @@ var TimePickerAndroid = function TimePickerAndroid(_ref) {
     helpText: helpText,
     style: style,
     testID: testID
-  })), open ? /*#__PURE__*/React__default.createElement(DateTimePicker, {
+  }))), open ? /*#__PURE__*/React__default.createElement(DateTimePicker, {
     testID: "timePickerAndroid",
     mode: "time",
     value: pickerInitValue,
@@ -26753,14 +26821,6 @@ var TimePickerAndroid = function TimePickerAndroid(_ref) {
   }) : null);
 };
 
-var StyledPickerWrapper = index$b(View)(function (_ref) {
-  var theme = _ref.theme;
-  return {
-    height: theme.__hd__.timePicker.sizes.height,
-    alignItems: 'center'
-  };
-});
-
 var TimePickerIOS = function TimePickerIOS(_ref) {
   var value = _ref.value,
     label = _ref.label,
@@ -26780,7 +26840,10 @@ var TimePickerIOS = function TimePickerIOS(_ref) {
     showSuffix = _ref$showSuffix === void 0 ? true : _ref$showSuffix,
     _ref$supportedOrienta = _ref.supportedOrientations,
     supportedOrientations = _ref$supportedOrienta === void 0 ? ['portrait'] : _ref$supportedOrienta,
-    TextInputComponent = _ref.TextInputComponent;
+    TextInputComponent = _ref.TextInputComponent,
+    inputProps = _ref.inputProps,
+    _ref$groupStyleEnable = _ref.groupStyleEnabled,
+    groupStyleEnabled = _ref$groupStyleEnable === void 0 ? false : _ref$groupStyleEnable;
   var _useState = useState(value || new Date()),
     _useState2 = _slicedToArray(_useState, 2),
     selectingDate = _useState2[0],
@@ -26796,15 +26859,19 @@ var TimePickerIOS = function TimePickerIOS(_ref) {
   useEffect(function () {
     setSelectingDate(value || new Date());
   }, [value]);
-  return /*#__PURE__*/React__default.createElement(TouchableOpacity, {
-    onPress: function onPress() {
-      return setOpen(true);
-    },
-    disabled: disabled
+  var onPress = useCallback(function () {
+    setOpen(true);
+  }, []);
+  return /*#__PURE__*/React__default.createElement(StyledTouchableOpacity, {
+    onPress: onPress,
+    disabled: disabled,
+    themeGroupStyleEnabled: groupStyleEnabled,
+    themeHasError: !!error,
+    testID: "time-picker-ios-touchable-opacity"
   }, /*#__PURE__*/React__default.createElement(View, {
     pointerEvents: "none",
     testID: "timePickerInputIOS"
-  }, /*#__PURE__*/React__default.createElement(InputComponent, {
+  }, /*#__PURE__*/React__default.createElement(InputComponent, _extends$1({}, inputProps, {
     label: label,
     value: displayValue,
     suffix: showSuffix ? 'clock-3' : undefined,
@@ -26815,7 +26882,7 @@ var TimePickerIOS = function TimePickerIOS(_ref) {
     helpText: helpText,
     testID: testID,
     style: style
-  })), /*#__PURE__*/React__default.createElement(BottomSheet$1, {
+  }))), /*#__PURE__*/React__default.createElement(BottomSheet$1, {
     open: open,
     onRequestClose: function onRequestClose() {
       return setOpen(false);