@hero-design/rn 7.10.2-rc.0 → 7.10.2

package/.turbo/turbo-build.log

@@ -1,8 +1,8 @@
-@hero-design/rn:build: cache hit, replaying output f6001293ac178b44
-@hero-design/rn:build: $ yarn build:js && yarn build:types
-@hero-design/rn:build: $ rollup -c
-@hero-design/rn:build: 
-@hero-design/rn:build: src/index.ts → lib/index.js, es/index.js...
-@hero-design/rn:build: (!) 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`.
-@hero-design/rn:build: created lib/index.js, es/index.js in 18.6s
-@hero-design/rn:build: $ tsc --noEmit false --emitDeclarationOnly
+@hero-design/rn:build: cache hit, replaying output f95bf09896acda51
+@hero-design/rn:build: $ yarn build:js && yarn build:types
+@hero-design/rn:build: $ rollup -c
+@hero-design/rn:build: 
+@hero-design/rn:build: src/index.ts → lib/index.js, es/index.js...
+@hero-design/rn:build: (!) 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`.
+@hero-design/rn:build: created lib/index.js, es/index.js in 18.9s
+@hero-design/rn:build: $ tsc --noEmit false --emitDeclarationOnly

package/es/index.js

@@ -3443,10 +3443,10 @@ var getTextInputTheme = function getTextInputTheme(theme) {
     labelHorizontalPadding: theme.space.xsmall,
     inputHorizontalMargin: theme.space.small,
     containerMarginVertical: theme.space.small,
-    errorContainerMarginLeft: theme.space.medium,
     errorContainerMarginRight: theme.space.xsmall,
     errorMarginLeft: theme.space.xsmall,
-    maxLengthLabelMarginLeft: theme.space.xsmall
+    maxLengthLabelMarginLeft: theme.space.xsmall,
+    errorAndHelpTextContainerPaddingLeft: theme.space.medium
   };
   var fontSizes = {
     text: theme.fontSizes.medium,
@@ -18372,7 +18372,6 @@ var StyledAsteriskLabelInsideTextInput = index$5(Typography.Text)(function (_ref
 var StyledErrorContainer = index$5(View)(function (_ref7) {
   var theme = _ref7.theme;
   return {
-    marginLeft: theme.__hd__.textInput.space.errorContainerMarginLeft,
     marginRight: theme.__hd__.textInput.space.errorContainerMarginRight,
     flexDirection: 'row',
     alignItems: 'center',
@@ -18404,8 +18403,7 @@ var StyledMaxLengthMessage = index$5(Typography.Text)(function (_ref9) {
 var StyledHelperText = index$5(Typography.Text)(function (_ref10) {
   var theme = _ref10.theme;
   return {
-    fontSize: theme.__hd__.textInput.fontSizes.error,
-    marginLeft: theme.__hd__.textInput.space.errorMarginLeft
+    fontSize: theme.__hd__.textInput.fontSizes.error
   };
 });
 var StyledTextInput = index$5(TextInput$1)(function (_ref11) {
@@ -18445,9 +18443,14 @@ var StyledTextInputAndLabelContainer = index$5(View)(function () {
     flexGrow: 2
   };
 });
-var StyledErrorAndHelpTextContainer = index$5(View)(function () {
+var StyledErrorAndHelpTextContainer = index$5(View)(function (_ref14) {
+  var theme = _ref14.theme;
+  return {
+    paddingLeft: theme.__hd__.textInput.space.errorAndHelpTextContainerPaddingLeft
+  };
+});
+var StyledErrorAndMaxLengthContainer = index$5(View)(function () {
   return {
-    flex: 1,
     flexDirection: 'row',
     justifyContent: 'space-between'
   };
@@ -18485,6 +18488,8 @@ var getVariant = function getVariant(_ref) {
 };
 
 var TextInput = function TextInput(_ref2) {
+  var _ref3;
+
   var label = _ref2.label,
       prefix = _ref2.prefix,
       suffix = _ref2.suffix,
@@ -18505,7 +18510,7 @@ var TextInput = function TextInput(_ref2) {
       nativeProps = _objectWithoutProperties$1(_ref2, _excluded$1);
 
   var textInputReference = useRef(null);
-  var displayText = value || defaultValue || '';
+  var displayText = (_ref3 = value !== undefined ? value : defaultValue) !== null && _ref3 !== void 0 ? _ref3 : '';
   var isEmptyValue = displayText.length === 0;
 
   var _React$useState = React.useState(false),
@@ -18593,7 +18598,7 @@ var TextInput = function TextInput(_ref2) {
     testID: "input-suffix",
     icon: suffix,
     size: "xsmall"
-  }) : suffix), /*#__PURE__*/React.createElement(StyledErrorAndHelpTextContainer, null, error && /*#__PURE__*/React.createElement(StyledErrorContainer, null, /*#__PURE__*/React.createElement(Icon, {
+  }) : suffix), /*#__PURE__*/React.createElement(StyledErrorAndHelpTextContainer, null, /*#__PURE__*/React.createElement(StyledErrorAndMaxLengthContainer, null, error && /*#__PURE__*/React.createElement(StyledErrorContainer, null, /*#__PURE__*/React.createElement(Icon, {
     testID: "input-error-icon",
     icon: "circle-info",
     size: "xsmall",
@@ -18603,7 +18608,7 @@ var TextInput = function TextInput(_ref2) {
   }, error)), shouldShowMaxLength && /*#__PURE__*/React.createElement(StyledMaxLengthMessage, {
     themeVariant: variant,
     fontSize: "small"
-  }, displayText.length, "/", maxLength), helpText && /*#__PURE__*/React.createElement(StyledHelperText, null, helpText)));
+  }, displayText.length, "/", maxLength)), helpText && /*#__PURE__*/React.createElement(StyledHelperText, null, helpText)));
 };
 
 function MultiSelect(_ref) {
@@ -18614,7 +18619,6 @@ function MultiSelect(_ref) {
       label = _ref.label,
       footerLabel = _ref.footerLabel,
       onConfirm = _ref.onConfirm;
-  var theme = useTheme$1();
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -18635,23 +18639,16 @@ function MultiSelect(_ref) {
     onPress: function onPress() {
       return setOpen(true);
     }
+  }, /*#__PURE__*/React.createElement(View, {
+    pointerEvents: "none"
   }, /*#__PURE__*/React.createElement(TextInput, {
     label: label,
     value: displayedValue,
-    onPressIn: function onPressIn() {
-      return setOpen(true);
-    },
-    editable: false // when input is not editable on Android, the text color is gray
-    // hence, adding this to make the text color the same as iOS
-    ,
-    textStyle: {
-      color: theme.colors.text
-    },
     suffix: "arrow-down",
     multiline: true,
     style: style,
     testID: testID
-  }), /*#__PURE__*/React.createElement(BottomSheet, {
+  })), /*#__PURE__*/React.createElement(BottomSheet, {
     open: open,
     onRequestClose: function onRequestClose() {
       return setOpen(false);
@@ -18721,7 +18718,6 @@ var SingleSelect = function SingleSelect(_ref) {
       style = _ref.style,
       label = _ref.label,
       onConfirm = _ref.onConfirm;
-  var theme = useTheme$1();
 
   var _useState = useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -18740,23 +18736,16 @@ var SingleSelect = function SingleSelect(_ref) {
     onPress: function onPress() {
       return setOpen(true);
     }
+  }, /*#__PURE__*/React.createElement(View, {
+    pointerEvents: "none"
   }, /*#__PURE__*/React.createElement(TextInput, {
     label: label,
     value: displayedValue,
-    onPressIn: function onPressIn() {
-      return setOpen(true);
-    },
-    editable: false // when input is not editable on Android, the text color is gray
-    // hence, adding this to make the text color the same as iOS
-    ,
-    textStyle: {
-      color: theme.colors.text
-    },
     suffix: "arrow-down",
     multiline: true,
     style: style,
     testID: testID
-  }), /*#__PURE__*/React.createElement(BottomSheet, {
+  })), /*#__PURE__*/React.createElement(BottomSheet, {
     open: open,
     onRequestClose: function onRequestClose() {
       return setOpen(false);

package/lib/index.js

@@ -3470,10 +3470,10 @@ var getTextInputTheme = function getTextInputTheme(theme) {
     labelHorizontalPadding: theme.space.xsmall,
     inputHorizontalMargin: theme.space.small,
     containerMarginVertical: theme.space.small,
-    errorContainerMarginLeft: theme.space.medium,
     errorContainerMarginRight: theme.space.xsmall,
     errorMarginLeft: theme.space.xsmall,
-    maxLengthLabelMarginLeft: theme.space.xsmall
+    maxLengthLabelMarginLeft: theme.space.xsmall,
+    errorAndHelpTextContainerPaddingLeft: theme.space.medium
   };
   var fontSizes = {
     text: theme.fontSizes.medium,
@@ -18399,7 +18399,6 @@ var StyledAsteriskLabelInsideTextInput = index$5(Typography.Text)(function (_ref
 var StyledErrorContainer = index$5(ReactNative.View)(function (_ref7) {
   var theme = _ref7.theme;
   return {
-    marginLeft: theme.__hd__.textInput.space.errorContainerMarginLeft,
     marginRight: theme.__hd__.textInput.space.errorContainerMarginRight,
     flexDirection: 'row',
     alignItems: 'center',
@@ -18431,8 +18430,7 @@ var StyledMaxLengthMessage = index$5(Typography.Text)(function (_ref9) {
 var StyledHelperText = index$5(Typography.Text)(function (_ref10) {
   var theme = _ref10.theme;
   return {
-    fontSize: theme.__hd__.textInput.fontSizes.error,
-    marginLeft: theme.__hd__.textInput.space.errorMarginLeft
+    fontSize: theme.__hd__.textInput.fontSizes.error
   };
 });
 var StyledTextInput = index$5(ReactNative.TextInput)(function (_ref11) {
@@ -18472,9 +18470,14 @@ var StyledTextInputAndLabelContainer = index$5(ReactNative.View)(function () {
     flexGrow: 2
   };
 });
-var StyledErrorAndHelpTextContainer = index$5(ReactNative.View)(function () {
+var StyledErrorAndHelpTextContainer = index$5(ReactNative.View)(function (_ref14) {
+  var theme = _ref14.theme;
+  return {
+    paddingLeft: theme.__hd__.textInput.space.errorAndHelpTextContainerPaddingLeft
+  };
+});
+var StyledErrorAndMaxLengthContainer = index$5(ReactNative.View)(function () {
   return {
-    flex: 1,
     flexDirection: 'row',
     justifyContent: 'space-between'
   };
@@ -18512,6 +18515,8 @@ var getVariant = function getVariant(_ref) {
 };
 
 var TextInput = function TextInput(_ref2) {
+  var _ref3;
+
   var label = _ref2.label,
       prefix = _ref2.prefix,
       suffix = _ref2.suffix,
@@ -18532,7 +18537,7 @@ var TextInput = function TextInput(_ref2) {
       nativeProps = _objectWithoutProperties$1(_ref2, _excluded$1);
 
   var textInputReference = React.useRef(null);
-  var displayText = value || defaultValue || '';
+  var displayText = (_ref3 = value !== undefined ? value : defaultValue) !== null && _ref3 !== void 0 ? _ref3 : '';
   var isEmptyValue = displayText.length === 0;
 
   var _React$useState = React__default["default"].useState(false),
@@ -18620,7 +18625,7 @@ var TextInput = function TextInput(_ref2) {
     testID: "input-suffix",
     icon: suffix,
     size: "xsmall"
-  }) : suffix), /*#__PURE__*/React__default["default"].createElement(StyledErrorAndHelpTextContainer, null, error && /*#__PURE__*/React__default["default"].createElement(StyledErrorContainer, null, /*#__PURE__*/React__default["default"].createElement(Icon, {
+  }) : suffix), /*#__PURE__*/React__default["default"].createElement(StyledErrorAndHelpTextContainer, null, /*#__PURE__*/React__default["default"].createElement(StyledErrorAndMaxLengthContainer, null, error && /*#__PURE__*/React__default["default"].createElement(StyledErrorContainer, null, /*#__PURE__*/React__default["default"].createElement(Icon, {
     testID: "input-error-icon",
     icon: "circle-info",
     size: "xsmall",
@@ -18630,7 +18635,7 @@ var TextInput = function TextInput(_ref2) {
   }, error)), shouldShowMaxLength && /*#__PURE__*/React__default["default"].createElement(StyledMaxLengthMessage, {
     themeVariant: variant,
     fontSize: "small"
-  }, displayText.length, "/", maxLength), helpText && /*#__PURE__*/React__default["default"].createElement(StyledHelperText, null, helpText)));
+  }, displayText.length, "/", maxLength)), helpText && /*#__PURE__*/React__default["default"].createElement(StyledHelperText, null, helpText)));
 };
 
 function MultiSelect(_ref) {
@@ -18641,7 +18646,6 @@ function MultiSelect(_ref) {
       label = _ref.label,
       footerLabel = _ref.footerLabel,
       onConfirm = _ref.onConfirm;
-  var theme = useTheme$1();
 
   var _useState = React.useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -18662,23 +18666,16 @@ function MultiSelect(_ref) {
     onPress: function onPress() {
       return setOpen(true);
     }
+  }, /*#__PURE__*/React__default["default"].createElement(ReactNative.View, {
+    pointerEvents: "none"
   }, /*#__PURE__*/React__default["default"].createElement(TextInput, {
     label: label,
     value: displayedValue,
-    onPressIn: function onPressIn() {
-      return setOpen(true);
-    },
-    editable: false // when input is not editable on Android, the text color is gray
-    // hence, adding this to make the text color the same as iOS
-    ,
-    textStyle: {
-      color: theme.colors.text
-    },
     suffix: "arrow-down",
     multiline: true,
     style: style,
     testID: testID
-  }), /*#__PURE__*/React__default["default"].createElement(BottomSheet, {
+  })), /*#__PURE__*/React__default["default"].createElement(BottomSheet, {
     open: open,
     onRequestClose: function onRequestClose() {
       return setOpen(false);
@@ -18748,7 +18745,6 @@ var SingleSelect = function SingleSelect(_ref) {
       style = _ref.style,
       label = _ref.label,
       onConfirm = _ref.onConfirm;
-  var theme = useTheme$1();
 
   var _useState = React.useState(false),
       _useState2 = _slicedToArray(_useState, 2),
@@ -18767,23 +18763,16 @@ var SingleSelect = function SingleSelect(_ref) {
     onPress: function onPress() {
       return setOpen(true);
     }
+  }, /*#__PURE__*/React__default["default"].createElement(ReactNative.View, {
+    pointerEvents: "none"
   }, /*#__PURE__*/React__default["default"].createElement(TextInput, {
     label: label,
     value: displayedValue,
-    onPressIn: function onPressIn() {
-      return setOpen(true);
-    },
-    editable: false // when input is not editable on Android, the text color is gray
-    // hence, adding this to make the text color the same as iOS
-    ,
-    textStyle: {
-      color: theme.colors.text
-    },
     suffix: "arrow-down",
     multiline: true,
     style: style,
     testID: testID
-  }), /*#__PURE__*/React__default["default"].createElement(BottomSheet, {
+  })), /*#__PURE__*/React__default["default"].createElement(BottomSheet, {
     open: open,
     onRequestClose: function onRequestClose() {
       return setOpen(false);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@hero-design/rn",
-  "version": "7.10.2-rc.0",
+  "version": "7.10.2",
   "license": "MIT",
   "main": "lib/index.js",
   "module": "es/index.js",
@@ -21,7 +21,7 @@
   "dependencies": {
     "@emotion/native": "^11.9.3",
     "@emotion/react": "^11.9.3",
-    "@hero-design/colors": "7.10.2-rc.0"
+    "@hero-design/colors": "7.10.2"
   },
   "peerDependencies": {
     "react": "17.0.2",