@hero-design/rn 8.124.1 → 8.124.2

package/CHANGELOG.md

@@ -1,5 +1,11 @@
 # @hero-design/rn
 
+## 8.124.2
+
+### Patch Changes
+
+- [#5047](https://github.com/Thinkei/hero-design/pull/5047) [`5cde14663c71d60f20a41546d8ffb679667a12ab`](https://github.com/Thinkei/hero-design/commit/5cde14663c71d60f20a41546d8ffb679667a12ab) Thanks [@ttkien](https://github.com/ttkien)! - [Select] Update Select chevron suffix icon behavior
+
 ## 8.124.1
 
 ### Patch Changes

package/es/index.js

@@ -26983,6 +26983,10 @@ function MultiSelect(_ref) {
   var onPress = useCallback(function () {
     setOpen(true);
   }, []);
+  var selectSuffix;
+  if (editable && !disabled) {
+    selectSuffix = open ? 'arrow-up' : 'arrow-down';
+  }
   useEffect(function () {
     setSelectingValue(value);
   }, [open, value]);
@@ -26998,7 +27002,7 @@ function MultiSelect(_ref) {
   }, /*#__PURE__*/React__default.createElement(TextInputComponent, _extends$1({}, inputProps, {
     label: label,
     value: renderSelectedValue ? rawValue : displayedValue,
-    suffix: "arrow-down",
+    suffix: selectSuffix,
     multiline: true,
     error: error,
     editable: editable,
@@ -27194,6 +27198,12 @@ var SingleSelect = function SingleSelect(_ref) {
   var onPress = useCallback(function () {
     setOpen(true);
   }, []);
+  var selectSuffix = useMemo(function () {
+    if (editable && !disabled) {
+      return open ? 'arrow-up' : 'arrow-down';
+    }
+    return undefined;
+  }, [editable, disabled, open]);
   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$1, {
@@ -27206,7 +27216,7 @@ var SingleSelect = function SingleSelect(_ref) {
   }, /*#__PURE__*/React__default.createElement(TextInputComponent, _extends$1({}, inputProps, {
     label: label,
     value: renderSelectedValue ? rawValue : displayedValue,
-    suffix: "arrow-down",
+    suffix: selectSuffix,
     multiline: true,
     error: error,
     editable: editable,

package/lib/index.js

@@ -27013,6 +27013,10 @@ function MultiSelect(_ref) {
   var onPress = React.useCallback(function () {
     setOpen(true);
   }, []);
+  var selectSuffix;
+  if (editable && !disabled) {
+    selectSuffix = open ? 'arrow-up' : 'arrow-down';
+  }
   React.useEffect(function () {
     setSelectingValue(value);
   }, [open, value]);
@@ -27028,7 +27032,7 @@ function MultiSelect(_ref) {
   }, /*#__PURE__*/React__namespace.default.createElement(TextInputComponent, _extends$1({}, inputProps, {
     label: label,
     value: renderSelectedValue ? rawValue : displayedValue,
-    suffix: "arrow-down",
+    suffix: selectSuffix,
     multiline: true,
     error: error,
     editable: editable,
@@ -27224,6 +27228,12 @@ var SingleSelect = function SingleSelect(_ref) {
   var onPress = React.useCallback(function () {
     setOpen(true);
   }, []);
+  var selectSuffix = React.useMemo(function () {
+    if (editable && !disabled) {
+      return open ? 'arrow-up' : 'arrow-down';
+    }
+    return undefined;
+  }, [editable, disabled, open]);
   return /*#__PURE__*/React__namespace.default.createElement(React__namespace.default.Fragment, null, /*#__PURE__*/React__namespace.default.createElement(reactNative.View, {
     pointerEvents: !editable || disabled || inputProps !== null && inputProps !== void 0 && inputProps.loading ? 'none' : 'auto'
   }, /*#__PURE__*/React__namespace.default.createElement(StyledTouchableOpacity$1, {
@@ -27236,7 +27246,7 @@ var SingleSelect = function SingleSelect(_ref) {
   }, /*#__PURE__*/React__namespace.default.createElement(TextInputComponent, _extends$1({}, inputProps, {
     label: label,
     value: renderSelectedValue ? rawValue : displayedValue,
-    suffix: "arrow-down",
+    suffix: selectSuffix,
     multiline: true,
     error: error,
     editable: editable,

package/package.json

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

package/src/components/Select/MultiSelect/index.tsx

@@ -107,6 +107,11 @@ function MultiSelect<V, T extends SelectOptionType<V>>({
     setOpen(true);
   }, []);
 
+  let selectSuffix: TextInputProps['suffix'];
+  if (editable && !disabled) {
+    selectSuffix = open ? 'arrow-up' : 'arrow-down';
+  }
+
   useEffect(() => {
     setSelectingValue(value);
   }, [open, value]);
@@ -131,7 +136,7 @@ function MultiSelect<V, T extends SelectOptionType<V>>({
               {...inputProps}
               label={label}
               value={renderSelectedValue ? rawValue : displayedValue}
-              suffix="arrow-down"
+              suffix={selectSuffix}
               multiline
               error={error}
               editable={editable}

package/src/components/Select/SingleSelect/index.tsx

@@ -1,4 +1,4 @@
-import React, { useCallback, useRef, useState } from 'react';
+import React, { useCallback, useMemo, useRef, useState } from 'react';
 import type {
   TextInputProps as NativeTextInputProps,
   SectionList,
@@ -90,6 +90,14 @@ const SingleSelect = <V, T extends SelectOptionType<V>>({
     setOpen(true);
   }, []);
 
+  const selectSuffix: TextInputProps['suffix'] = useMemo(() => {
+    if (editable && !disabled) {
+      return open ? 'arrow-up' : 'arrow-down';
+    }
+
+    return undefined;
+  }, [editable, disabled, open]);
+
   return (
     <>
       <View
@@ -111,7 +119,7 @@ const SingleSelect = <V, T extends SelectOptionType<V>>({
               {...inputProps}
               label={label}
               value={renderSelectedValue ? rawValue : displayedValue}
-              suffix="arrow-down"
+              suffix={selectSuffix}
               multiline
               error={error}
               editable={editable}