dhre-ui-kit 0.0.21 → 0.0.23

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "dhre-ui-kit",
-  "version": "0.0.21",
+  "version": "0.0.23",
   "main": "src/index.ts",
   "files": [
     "src",

package/src/App.tsx

@@ -1,14 +1,42 @@
 import React from 'react';
 import {ThemeProvider} from './theme/ThemeContext';
-import {Badge, DateRangePicker, Line} from './index';
+import {Badge, Line} from './index';
 import {ArrowLeft, CalenderDots} from './assets';
 import {View} from 'react-native';
 import CustomButton from './components/button/Button';
 
 const App = () => {
   return (
-      <DateRangePicker onPress={() => {}} />
+    <ThemeProvider>
+      <View style={{marginTop: 50}}>
+        <Badge
+          handleIconPress={function (): void {}}
+          text="gggsdfghjhgf"
+          style={{margin: 20}}
+          iconName={<CalenderDots width={20} height={20} />}
+          textStyle={{color: 'black'}}
+          iconStyle={{}}
+        />
+        <Line />
+        <CustomButton
+          title="Yes"
+          onPress={() => console.log('Yes Button Pressed')}
+          leftIcon={<ArrowLeft />}
+          // titleColor={color.CONTENT_SECONDRY[currentTheme]}
+          titleVariant="L2_REGULAR"
+          containerStyle={[
+            {
+              borderWidth: 1,
+              borderRadius: 20,
 
+              height: 40,
+            },
+          ]}
+          // iconStyle={styles.iconStyle}
+          imagePosition="left"
+        />
+      </View>
+    </ThemeProvider>
   );
 };
 

package/src/index.ts

@@ -32,4 +32,12 @@ export {default as DateRangePicker} from './components/dateRangePicker';
 export {default as OurOfficesButton} from './components/OutOfOffice';
 export {default as NotificationBandge} from './components/notificationBandge';
 
-export * from './utils/stylehelper';
+export {FONT_STYLES} from './theme/fonts';
+export {DHRE_DEFAULT, DHRE_COLORS_TEXT} from './theme/colors';
+export {
+  verticalScale,
+  horizontalScale,
+  moderateScale,
+} from './utils/stylehelper';
+
+export {default} from './theme/themes';

package/src/theme/ThemeContext.tsx

@@ -14,8 +14,8 @@ interface ThemeProviderProps {
 
 export const ThemeProvider: React.FC<ThemeProviderProps> = ({children}) => {
   // eslint-disable-next-line @typescript-eslint/no-explicit-any
-  // const mode = useSelector((state: any) => state.theme.currentTheme);
-  const mode = 'light'
+  const mode = useSelector((state: any) => state.theme.currentTheme);
+  // const mode = 'light'
   // Filter the theme based on the mode (light or dark)
   const filteredTheme = Object.keys(theme).reduce((acc, key) => {
     acc[key] = theme[key][mode];

package/src/theme/colors.ts

@@ -167,6 +167,10 @@ export const DHRE_DEFAULT = {
   DH_BG_GREY_800: '#878BA0',
   DH_BG_GREY_900: '#6F7387',
   DH_BG_GREY: '#F2F3F8',
+  DH_SUCESS: '#2DE3A6',
+  DH_ERROR: '#EB382D',
+  DH_INFO: '#339ECF',
+  DH_SEMENTIC_ERROR: '#EB0542',
 };
 
 export const DHRE_COLORS_TEXT = {