@hero-design/rn 8.91.0 → 8.91.3

package/src/components/DatePicker/__tests__/__snapshots__/DatePicker.spec.tsx.snap

@@ -162,7 +162,26 @@ exports[`DatePicker renders DatePickerAndroid when OS is android 1`] = `
               themeTypeface="neutral"
               themeVariant="regular"
             >
-              Start date
+              <Text
+                allowFontScaling={false}
+                style={
+                  [
+                    {
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
+                    },
+                    undefined,
+                  ]
+                }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular"
+              >
+                Start date
+              </Text>
             </Text>
           </View>
           <View
@@ -191,6 +210,7 @@ exports[`DatePicker renders DatePickerAndroid when OS is android 1`] = `
               onChangeText={[Function]}
               onFocus={[Function]}
               placeholder=" "
+              placeholderTextColor="#4d6265"
               style={
                 [
                   {
@@ -444,7 +464,26 @@ exports[`DatePicker renders DatePickerIOS when OS is iOS 1`] = `
               themeTypeface="neutral"
               themeVariant="regular"
             >
-              Start date
+              <Text
+                allowFontScaling={false}
+                style={
+                  [
+                    {
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
+                    },
+                    undefined,
+                  ]
+                }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular"
+              >
+                Start date
+              </Text>
             </Text>
           </View>
           <View
@@ -473,6 +512,7 @@ exports[`DatePicker renders DatePickerIOS when OS is iOS 1`] = `
               onChangeText={[Function]}
               onFocus={[Function]}
               placeholder=" "
+              placeholderTextColor="#4d6265"
               style={
                 [
                   {
@@ -726,7 +766,26 @@ exports[`DatePicker renders variant Calendar 1`] = `
               themeTypeface="neutral"
               themeVariant="regular"
             >
-              Start date
+              <Text
+                allowFontScaling={false}
+                style={
+                  [
+                    {
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
+                    },
+                    undefined,
+                  ]
+                }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular"
+              >
+                Start date
+              </Text>
             </Text>
           </View>
           <View
@@ -755,6 +814,7 @@ exports[`DatePicker renders variant Calendar 1`] = `
               onChangeText={[Function]}
               onFocus={[Function]}
               placeholder=" "
+              placeholderTextColor="#4d6265"
               style={
                 [
                   {

package/src/components/DatePicker/__tests__/__snapshots__/DatePickerAndroid.spec.tsx.snap

@@ -162,7 +162,26 @@ exports[`DatePickerAndroid renders correctly 1`] = `
               themeTypeface="neutral"
               themeVariant="regular"
             >
-              Start date
+              <Text
+                allowFontScaling={false}
+                style={
+                  [
+                    {
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
+                    },
+                    undefined,
+                  ]
+                }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular"
+              >
+                Start date
+              </Text>
             </Text>
           </View>
           <View
@@ -191,6 +210,7 @@ exports[`DatePickerAndroid renders correctly 1`] = `
               onChangeText={[Function]}
               onFocus={[Function]}
               placeholder=" "
+              placeholderTextColor="#4d6265"
               style={
                 [
                   {

package/src/components/DatePicker/__tests__/__snapshots__/DatePickerCalendar.spec.tsx.snap

@@ -162,7 +162,26 @@ exports[`DatePickerCalendar renders correctly 1`] = `
               themeTypeface="neutral"
               themeVariant="regular"
             >
-              Start date
+              <Text
+                allowFontScaling={false}
+                style={
+                  [
+                    {
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
+                    },
+                    undefined,
+                  ]
+                }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular"
+              >
+                Start date
+              </Text>
             </Text>
           </View>
           <View
@@ -191,6 +210,7 @@ exports[`DatePickerCalendar renders correctly 1`] = `
               onChangeText={[Function]}
               onFocus={[Function]}
               placeholder=" "
+              placeholderTextColor="#4d6265"
               style={
                 [
                   {

package/src/components/DatePicker/__tests__/__snapshots__/DatePickerIOS.spec.tsx.snap

@@ -162,7 +162,26 @@ exports[`DatePickerIOS renders correctly 1`] = `
               themeTypeface="neutral"
               themeVariant="regular"
             >
-              Start date
+              <Text
+                allowFontScaling={false}
+                style={
+                  [
+                    {
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
+                    },
+                    undefined,
+                  ]
+                }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular"
+              >
+                Start date
+              </Text>
             </Text>
           </View>
           <View
@@ -191,6 +210,7 @@ exports[`DatePickerIOS renders correctly 1`] = `
               onChangeText={[Function]}
               onFocus={[Function]}
               placeholder=" "
+              placeholderTextColor="#4d6265"
               style={
                 [
                   {
@@ -831,7 +851,26 @@ exports[`DatePickerIOS renders correctly with custom locale 1`] = `
               themeTypeface="neutral"
               themeVariant="regular"
             >
-              Start date
+              <Text
+                allowFontScaling={false}
+                style={
+                  [
+                    {
+                      "color": "#001f23",
+                      "fontFamily": "BeVietnamPro-Regular",
+                      "fontSize": 16,
+                      "letterSpacing": 0.48,
+                      "lineHeight": 24,
+                    },
+                    undefined,
+                  ]
+                }
+                themeIntent="body"
+                themeTypeface="neutral"
+                themeVariant="regular"
+              >
+                Start date
+              </Text>
             </Text>
           </View>
           <View
@@ -860,6 +899,7 @@ exports[`DatePickerIOS renders correctly with custom locale 1`] = `
               onChangeText={[Function]}
               onFocus={[Function]}
               placeholder=" "
+              placeholderTextColor="#4d6265"
               style={
                 [
                   {

package/src/components/FAB/ActionGroup/__tests__/__snapshots__/index.spec.tsx.snap

@@ -73,7 +73,7 @@ exports[`ActionGroup has active false 1`] = `
             "marginTop": 24,
             "opacity": 1,
             "padding": 20,
-            "shadowColor": "#001f23",
+            "shadowColor": "#121214",
             "shadowOffset": {
               "height": 2,
               "width": 0,
@@ -266,7 +266,7 @@ exports[`ActionGroup has active true 1`] = `
             "marginTop": 24,
             "opacity": 1,
             "padding": 20,
-            "shadowColor": "#001f23",
+            "shadowColor": "#121214",
             "shadowOffset": {
               "height": 2,
               "width": 0,
@@ -1088,7 +1088,7 @@ exports[`ActionGroup has active true 1`] = `
               "marginTop": 24,
               "opacity": 1,
               "padding": 20,
-              "shadowColor": "#001f23",
+              "shadowColor": "#121214",
               "shadowOffset": {
                 "height": 2,
                 "width": 0,

package/src/components/FAB/Pair/__tests__/__snapshots__/index.spec.tsx.snap

@@ -66,7 +66,7 @@ exports[`FABPair renders correctly 1`] = `
           "marginRight": 8,
           "opacity": 1,
           "padding": 20,
-          "shadowColor": "#001f23",
+          "shadowColor": "#121214",
           "shadowOffset": {
             "height": 2,
             "width": 0,
@@ -177,7 +177,7 @@ exports[`FABPair renders correctly 1`] = `
           "marginRight": undefined,
           "opacity": 1,
           "padding": 20,
-          "shadowColor": "#001f23",
+          "shadowColor": "#121214",
           "shadowOffset": {
             "height": 2,
             "width": 0,

package/src/components/FAB/__tests__/__snapshots__/StyledFAB.spec.tsx.snap

@@ -48,7 +48,7 @@ exports[`StyledFAB renders correctly 1`] = `
         "justifyContent": "center",
         "opacity": 1,
         "padding": 20,
-        "shadowColor": "#001f23",
+        "shadowColor": "#121214",
         "shadowOffset": {
           "height": 2,
           "width": 0,
@@ -150,7 +150,7 @@ exports[`StyledFAB renders correctly 2`] = `
         "justifyContent": "center",
         "opacity": 1,
         "padding": 20,
-        "shadowColor": "#001f23",
+        "shadowColor": "#121214",
         "shadowOffset": {
           "height": 2,
           "width": 0,

package/src/components/FAB/__tests__/__snapshots__/index.spec.tsx.snap

@@ -50,7 +50,7 @@ exports[`FAB when animated is false renders StyledFABIcon 1`] = `
         "justifyContent": "center",
         "opacity": 1,
         "padding": 20,
-        "shadowColor": "#001f23",
+        "shadowColor": "#121214",
         "shadowOffset": {
           "height": 2,
           "width": 0,
@@ -189,7 +189,7 @@ exports[`FAB when animated is true renders animatedFABIcon 1`] = `
         "justifyContent": "center",
         "opacity": 1,
         "padding": 20,
-        "shadowColor": "#001f23",
+        "shadowColor": "#121214",
         "shadowOffset": {
           "height": 2,
           "width": 0,
@@ -341,7 +341,7 @@ exports[`FAB when title has value renders correctly 1`] = `
         "justifyContent": "center",
         "opacity": 1,
         "padding": 20,
-        "shadowColor": "#001f23",
+        "shadowColor": "#121214",
         "shadowOffset": {
           "height": 2,
           "width": 0,

package/src/components/FloatingIsland/__tests__/__snapshots__/index.spec.tsx.snap

@@ -50,7 +50,7 @@ exports[`FloatingIsland renders correctly 1`] = `
         "opacity": 1,
         "padding": 8,
         "position": "absolute",
-        "shadowColor": "#001f23",
+        "shadowColor": "#121214",
         "shadowOffset": {
           "height": 2,
           "width": 0,
@@ -156,7 +156,7 @@ exports[`FloatingIsland renders icons as prefix and suffix correctly 1`] = `
         "opacity": 1,
         "padding": 8,
         "position": "absolute",
-        "shadowColor": "#001f23",
+        "shadowColor": "#121214",
         "shadowOffset": {
           "height": 2,
           "width": 0,
@@ -330,7 +330,7 @@ exports[`FloatingIsland renders prefix correctly 1`] = `
         "opacity": 1,
         "padding": 8,
         "position": "absolute",
-        "shadowColor": "#001f23",
+        "shadowColor": "#121214",
         "shadowOffset": {
           "height": 2,
           "width": 0,
@@ -470,7 +470,7 @@ exports[`FloatingIsland renders suffix correctly 1`] = `
         "opacity": 1,
         "padding": 8,
         "position": "absolute",
-        "shadowColor": "#001f23",
+        "shadowColor": "#121214",
         "shadowOffset": {
           "height": 2,
           "width": 0,

package/src/components/List/__tests__/__snapshots__/ListItem.spec.tsx.snap

@@ -945,11 +945,12 @@ exports[`ListItem renders correctly ListItem with prefix suffix is React.Element
             style={
               [
                 {
-                  "backgroundColor": "#401960",
+                  "backgroundColor": "#33144d",
                   "borderRadius": 999,
                   "display": "flex",
                   "height": 24,
                   "justifyContent": "center",
+                  "opacity": 1,
                   "paddingHorizontal": 4,
                   "width": 48,
                 },
@@ -963,7 +964,7 @@ exports[`ListItem renders correctly ListItem with prefix suffix is React.Element
               collapsable={false}
               style={
                 {
-                  "backgroundColor": "#ffffff",
+                  "backgroundColor": undefined,
                   "borderRadius": 999,
                   "height": 16,
                   "left": 24,

package/src/components/List/__tests__/__snapshots__/StyledListItem.spec.tsx.snap

@@ -260,7 +260,7 @@ exports[`ListItemContainer renders correctly themeSelected false themeVariant ca
           "elevation": 3,
           "flexDirection": "row",
           "padding": 16,
-          "shadowColor": "#001f23",
+          "shadowColor": "#121214",
           "shadowOffset": {
             "height": 2,
             "width": 0,
@@ -433,7 +433,7 @@ exports[`ListItemContainer renders correctly themeSelected true themeVariant car
           "elevation": 3,
           "flexDirection": "row",
           "padding": 16,
-          "shadowColor": "#001f23",
+          "shadowColor": "#121214",
           "shadowOffset": {
             "height": 2,
             "width": 0,

package/src/components/MapPin/__tests__/__snapshots__/index.spec.tsx.snap

@@ -36,7 +36,7 @@ exports[`MapPin renders applied state correctly 1`] = `
             "elevation": 3,
             "height": 42,
             "justifyContent": "center",
-            "shadowColor": "#001f23",
+            "shadowColor": "#121214",
             "shadowOffset": {
               "height": 2,
               "width": 0,
@@ -177,7 +177,7 @@ exports[`MapPin renders icon correctly 1`] = `
             "elevation": 3,
             "height": 42,
             "justifyContent": "center",
-            "shadowColor": "#001f23",
+            "shadowColor": "#121214",
             "shadowOffset": {
               "height": 2,
               "width": 0,
@@ -267,7 +267,7 @@ exports[`MapPin renders image correctly 1`] = `
             "elevation": 3,
             "height": 42,
             "justifyContent": "center",
-            "shadowColor": "#001f23",
+            "shadowColor": "#121214",
             "shadowOffset": {
               "height": 2,
               "width": 0,
@@ -360,7 +360,7 @@ exports[`MapPin renders selected state correctly 1`] = `
             "elevation": 3,
             "height": 42,
             "justifyContent": "center",
-            "shadowColor": "#001f23",
+            "shadowColor": "#121214",
             "shadowOffset": {
               "height": 2,
               "width": 0,

package/src/components/RichTextEditor/RichTextEditor.tsx

@@ -39,6 +39,7 @@ import { postMessage, requestBlurEditor } from './utils/rnWebView';
 import type { WebViewEventMessage } from './utils/rnWebView';
 import { LABEL_ANIMATION_DURATION } from '../TextInput';
 import { TextUnit } from './types';
+import Typography from '../Typography';
 
 export interface RichTextEditorRef {
   requestBlur: VoidFunction;
@@ -408,7 +409,7 @@ const RichTextEditor: ComponentType<RichTextEditorProps> = ({
                 *
               </StyledAsteriskLabelInsideTextInput>
             )}
-            {label}
+            <Typography.Body>{label}</Typography.Body>
           </StyledLabelInsideTextInput>
         )}
       </StyledLabelContainerInsideTextInput>

package/src/components/RichTextEditor/__tests__/__snapshots__/RichTextEditor.spec.tsx.snap

@@ -83,7 +83,26 @@ exports[`RichTextEditor onMessage recevied event editor-layout should update hei
         themeTypeface="neutral"
         themeVariant="regular"
       >
-        Rich Text Editor
+        <Text
+          allowFontScaling={false}
+          style={
+            [
+              {
+                "color": "#001f23",
+                "fontFamily": "BeVietnamPro-Regular",
+                "fontSize": 16,
+                "letterSpacing": 0.48,
+                "lineHeight": 24,
+              },
+              undefined,
+            ]
+          }
+          themeIntent="body"
+          themeTypeface="neutral"
+          themeVariant="regular"
+        >
+          Rich Text Editor
+        </Text>
       </Text>
     </View>
     <View
@@ -405,7 +424,26 @@ exports[`RichTextEditor should render correctly 1`] = `
         themeTypeface="neutral"
         themeVariant="regular"
       >
-        Rich Text Editor
+        <Text
+          allowFontScaling={false}
+          style={
+            [
+              {
+                "color": "#001f23",
+                "fontFamily": "BeVietnamPro-Regular",
+                "fontSize": 16,
+                "letterSpacing": 0.48,
+                "lineHeight": 24,
+              },
+              undefined,
+            ]
+          }
+          themeIntent="body"
+          themeTypeface="neutral"
+          themeVariant="regular"
+        >
+          Rich Text Editor
+        </Text>
       </Text>
     </View>
     <View

package/src/components/Search/SearchOneLine.tsx

@@ -16,6 +16,7 @@ import {
 import { IconName } from '../Icon';
 import { renderPrefix, renderSuffix } from './utils';
 import Button from '../Button';
+import { useTheme } from '../../theme';
 
 export type SearchOneLineHandles = Pick<
   RNTextInput,
@@ -132,7 +133,7 @@ const SearchOneLine = forwardRef<SearchOneLineHandles, SearchOneLineProps>(
     } = props;
 
     const [isFocused, setIsFocused] = React.useState(false);
-
+    const theme = useTheme();
     const displayText = (value !== undefined ? value : defaultValue) ?? '';
     const isEmptyValue = displayText.length === 0;
 
@@ -215,6 +216,7 @@ const SearchOneLine = forwardRef<SearchOneLineHandles, SearchOneLineProps>(
               value,
               defaultValue,
               placeholder,
+              placeholderTextColor: theme.__hd__.textInput.colors.placeholder,
             },
             ref: (rnTextInputRef) => {
               innerTextInput.current = rnTextInputRef;

package/src/components/Search/__tests__/__snapshots__/SearchOneLine.spec.tsx.snap

@@ -76,6 +76,7 @@ exports[`SearchOneLine idle renders correctly 1`] = `
         onBlur={[Function]}
         onFocus={[Function]}
         placeholder="Search"
+        placeholderTextColor="#4d6265"
         style={
           [
             {
@@ -213,6 +214,7 @@ exports[`SearchOneLine idle renders custom affix correctly 1`] = `
         onBlur={[Function]}
         onFocus={[Function]}
         placeholder="Search"
+        placeholderTextColor="#4d6265"
         style={
           [
             {
@@ -357,6 +359,7 @@ exports[`SearchOneLine idle renders reserved variant correctly 1`] = `
         onBlur={[Function]}
         onFocus={[Function]}
         placeholder="Search"
+        placeholderTextColor="#4d6265"
         style={
           [
             {
@@ -502,6 +505,7 @@ exports[`filled disabled renders correctly 1`] = `
         onChangeText={[MockFunction]}
         onFocus={[Function]}
         placeholder="Search"
+        placeholderTextColor="#4d6265"
         style={
           [
             {
@@ -648,6 +652,7 @@ exports[`filled readonly renders correctly 1`] = `
         onChangeText={[MockFunction]}
         onFocus={[Function]}
         placeholder="Search"
+        placeholderTextColor="#4d6265"
         style={
           [
             {
@@ -793,6 +798,7 @@ exports[`filled renders clearable input correctly 1`] = `
         onBlur={[Function]}
         onFocus={[Function]}
         placeholder="Search"
+        placeholderTextColor="#4d6265"
         style={
           [
             {
@@ -973,6 +979,7 @@ exports[`filled renders correctly 1`] = `
         onBlur={[Function]}
         onFocus={[Function]}
         placeholder="Search"
+        placeholderTextColor="#4d6265"
         style={
           [
             {