jfs-components 0.0.62 → 0.0.63

package/src/components/InputSearch/InputSearch.tsx

@@ -1,6 +1,7 @@
 import React, { useState } from 'react'
-import { View, Text, Pressable, type StyleProp, type ViewStyle, type TextStyle } from 'react-native'
+import { View, Text, Pressable, type StyleProp, type ViewStyle, type TextStyle, type TextInputProps as RNTextInputProps } from 'react-native'
 import { getVariableByName } from '../../design-tokens/figma-variables-resolver'
+import { EMPTY_MODES } from '../../utils/react-utils'
 import Icon from '../../icons/Icon'
 import TextInput from '../TextInput/TextInput'
 
@@ -9,13 +10,19 @@ import TextInput from '../TextInput/TextInput'
  */
 type SupportTextProps = {
     label?: string;
+    /**
+     * Icon name from the icon registry (e.g. 'ic_info', 'ic_cart').
+     * Defaults to 'ic_info'.
+     */
+    iconName?: string;
     modes?: Record<string, any>;
     style?: StyleProp<ViewStyle>;
 }
 
 function SupportText({
     label = "Support Text",
-    modes = {},
+    iconName = "ic_info",
+    modes = EMPTY_MODES,
     style
 }: SupportTextProps) {
     // Resolve variables
@@ -35,7 +42,7 @@ function SupportText({
             alignItems: 'center',
             gap: gap,
         }, style]}>
-            <Icon name="ic_info" size={iconSize} color={foreground} />
+            <Icon name={iconName} size={iconSize} color={foreground} />
             <Text style={{
                 color: foreground,
                 fontSize: fontSize,
@@ -52,6 +59,11 @@ function SupportText({
 export type InputSearchProps = {
     supportText?: boolean;
     supportTextLabel?: string;
+    /**
+     * Icon name from the icon registry to render inside the support text
+     * (e.g. 'ic_info', 'ic_cart'). Defaults to 'ic_info'.
+     */
+    supportTextIcon?: string;
     modes?: Record<string, any>;
     containerStyle?: StyleProp<ViewStyle>;
 
@@ -66,12 +78,13 @@ export type InputSearchProps = {
     inputStyle?: StyleProp<TextStyle>;
     accessibilityLabel?: string;
     accessibilityHint?: string;
-}
+} & Omit<RNTextInputProps, 'style' | 'onChangeText' | 'onFocus' | 'onBlur' | 'placeholder' | 'value'>;
 
 export default function InputSearch({
     supportText = true,
     supportTextLabel = "Support Text",
-    modes = {},
+    supportTextIcon = "ic_info",
+    modes = EMPTY_MODES,
     containerStyle,
     placeholder = "Search",
     value,
@@ -158,6 +171,7 @@ export default function InputSearch({
             {supportText && (
                 <SupportText
                     label={supportTextLabel}
+                    iconName={supportTextIcon}
                     modes={componentModes}
                 />
             )}

package/src/components/LazyList/LazyList.tsx

@@ -1,7 +1,7 @@
 import React from 'react'
 import { View, type StyleProp, type ViewStyle } from 'react-native'
 import { getVariableByName } from '../../design-tokens/figma-variables-resolver'
-import { cloneChildrenWithModes } from '../../utils/react-utils'
+import { EMPTY_MODES, cloneChildrenWithModes } from '../../utils/react-utils'
 
 type LazyListProps = {
   listGroupsSlot?: React.ReactNode;
@@ -32,7 +32,7 @@ type LazyListProps = {
  */
 function LazyList({
   listGroupsSlot,
-  modes = {},
+  modes = EMPTY_MODES,
   style,
   accessibilityLabel = undefined,
   accessibilityHint,

package/src/components/LinearMeter/LinearMeter.tsx

@@ -1,6 +1,7 @@
 import React from 'react'
 import { View, Text, type StyleProp, type ViewStyle, type TextStyle, type DimensionValue } from 'react-native'
 import { getVariableByName } from '../../design-tokens/figma-variables-resolver'
+import { EMPTY_MODES } from '../../utils/react-utils'
 import MoneyValue from '../MoneyValue/MoneyValue'
 
 type LinearMeterLabelProps = {
@@ -11,7 +12,7 @@ type LinearMeterLabelProps = {
 
 const LinearMeterLabel = ({
     children,
-    modes = {},
+    modes = EMPTY_MODES,
     style,
     ...rest
 }: LinearMeterLabelProps) => {
@@ -48,7 +49,7 @@ export type LinearMeterProps = {
 
 const LinearMeter = ({
     value = 0,
-    modes = {},
+    modes = EMPTY_MODES,
     style,
     trackStyle,
     indicatorStyle,

package/src/components/ListGroup/ListGroup.tsx

@@ -6,7 +6,7 @@ import { getVariableByName } from '../../design-tokens/figma-variables-resolver'
  * Helper function to recursively clone children and pass modes prop to components that accept it.
  * This ensures that all child components in slots receive the modes prop from the parent.
  */
-import { cloneChildrenWithModes, flattenChildren } from '../../utils/react-utils'
+import { EMPTY_MODES, cloneChildrenWithModes, flattenChildren } from '../../utils/react-utils'
 
 type ListGroupProps = {
   label?: string;
@@ -47,7 +47,7 @@ function ListGroup({
   label = '',
   listGroupSlot,
   children,
-  modes = {},
+  modes = EMPTY_MODES,
   style,
   accessibilityLabel,
   accessibilityHint,