dhre-ui-kit 0.0.24 → 0.0.26

package/__mocks__/custom-text.mock.tsx

@@ -0,0 +1,19 @@
+import React from 'react';
+import {CustomTextProps} from '../src/components/customText/CustomText';
+import CustomTypography from '../src/components/customTypography/CustomTypography';
+
+// const mockProps: CustomTextProps = {
+//   text: 'string',
+//   variant: 'string',
+// };
+
+// const CustomText = jest.requireActual(
+//   'dhre-ui-kit/src/components/customText/CustomText.tsx',
+// );
+
+export default {
+  CustomText: (mockProps: CustomTextProps) => {
+    const {text, variant} = mockProps;
+    return <CustomTypography variant={variant} text={text || ''} />;
+  },
+};

package/__mocks__/setup-tests.ts

@@ -0,0 +1,21 @@
+jest.mock('rn-tooltip', () => {
+  return jest.fn(({children}) => children);
+});
+
+jest.mock('react-native-otp-verify', () => ({
+  getOtp: jest.fn(),
+  getHash: jest.fn(),
+  addListener: jest.fn(),
+  removeListener: jest.fn(),
+}));
+
+jest.mock('react-native-pdf', () => 'Pdf');
+
+jest.mock('react-native-webview', () => {
+  return jest.fn().mockImplementation(() => {
+    return null;
+  });
+});
+jest.mock('react-redux', () => ({
+  useSelector: jest.fn(),
+}));

package/__mocks__/svgMock.ts

@@ -0,0 +1,2 @@
+module.exports = 'SvgMock';
+module.exports.ReactComponent = 'SvgMock';

package/package.json

@@ -1,10 +1,11 @@
 {
   "name": "dhre-ui-kit",
-  "version": "0.0.24",
+  "version": "0.0.26",
   "main": "src/index.ts",
   "files": [
     "src",
-    "README.md"
+    "README.md",
+    "__mocks__"
   ],
   "scripts": {
     "android": "react-native run-android",

package/src/components/customSearchBar/CustomSearchBar.interface.ts

@@ -1,9 +1,14 @@
-import {TextInputProps, ViewStyle} from 'react-native';
+import {TextInputProps, TextStyle, ViewStyle} from 'react-native';
 
 export interface CustomSearchBarProps extends TextInputProps {
   height?: number;
-  testID?: string;
   disabled?: boolean;
+  testID?: string;
   inputContainerStyle?: ViewStyle;
+  searchIconStyle?: TextStyle;
+  crossIconStyle?: TextStyle;
+  inputStyle?: TextStyle;
+  onSearchIconPress?: () => void;
+  onCrossIconPress?: () => void;
   handleOnChangeText?: (text: string) => void;
 }

package/src/components/customSearchBar/CustomSearchBar.tsx

@@ -10,10 +10,16 @@ const CustomSearchBar = ({
   disabled = false,
   testID = 'CUSTOM-SEARCH-BAR',
   inputContainerStyle,
+  searchIconStyle,
+  crossIconStyle,
+  inputStyle,
+  onSearchIconPress,
+  onCrossIconPress,
   handleOnChangeText,
   ...props
 }: CustomSearchBarProps) => {
   const [value, setValue] = useState('');
+
   return (
     <View
       testID={testID}
@@ -25,15 +31,22 @@ const CustomSearchBar = ({
         },
         inputContainerStyle,
       ]}>
-      {React.cloneElement(<SearchIcon />, {
-        width: moderateScale(24),
-        height: moderateScale(24),
-        style: styles.searchIconStyle,
-      })}
+      <Pressable
+        onPress={() => {
+          console.log('Search icon pressed'); // Default behavior
+          onSearchIconPress?.(); // Call custom handler if provided
+        }}
+        style={searchIconStyle}>
+        {React.cloneElement(<SearchIcon />, {
+          width: moderateScale(24),
+          height: moderateScale(24),
+          style: [styles.searchIconStyle, searchIconStyle],
+        })}
+      </Pressable>
       <TextInput
         {...props}
         testID={`${testID}-INPUT`}
-        style={styles.input}
+        style={[styles.input, inputStyle]} // Apply custom input styles
         editable={!disabled}
         value={value}
         placeholderTextColor={disabled ? '#686868' : '#A7A7A7'}
@@ -43,11 +56,16 @@ const CustomSearchBar = ({
         }}
       />
       {value && (
-        <Pressable onPress={() => setValue('')}>
+        <Pressable
+          onPress={() => {
+            setValue(''); // Clear the input field
+            onCrossIconPress?.(); // Call custom handler if provided
+          }}
+          style={crossIconStyle}>
           {React.cloneElement(<CrossIcon />, {
             width: moderateScale(24),
             height: moderateScale(24),
-            style: styles.crossIconStyle,
+            style: [styles.crossIconStyle, crossIconStyle],
           })}
         </Pressable>
       )}

package/src/index.ts

@@ -41,3 +41,5 @@ export {
 } from './utils/stylehelper';
 
 export {default} from './theme/themes';
+
+export {default as CustomTextTest} from '../__mocks__/custom-text.mock';