@zezosoft/zezo-ott-react-native-ui-kit 0.1.0 → 1.0.1

package/src/Styles/globalStyles.ts

@@ -0,0 +1,75 @@
+/**
+ * @author Naresh Dhamu
+ * @lastModified Sat 14 Jun 2025 at 02:59 PM
+ */
+
+import { StyleSheet } from 'react-native';
+
+const globalStyles = StyleSheet.create({
+  centerContainer: {
+    flex: 1,
+    width: '100%',
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  container: {
+    flex: 1
+  },
+  newContainer: {
+    flex: 1
+  },
+  // new styles
+  flexOneJustifyContentAndAlignItemsCenter: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  flexOneJustifyContentCenterAndAlignItemsCenter: {
+    flex: 1,
+    justifyContent: 'center',
+    alignItems: 'center'
+  },
+  hundredPercentWidth: {
+    width: '100%'
+  },
+  hundredPercentHeight: {
+    height: '100%'
+  },
+  marginZeroAndPaddingZero: {
+    margin: 0,
+    padding: 0
+  },
+  overflowHidden: {
+    overflow: 'hidden'
+  },
+  flexOne: {
+    flex: 1
+  },
+  flexZero: {
+    flex: 0
+  },
+  positionAbsolute: {
+    position: 'absolute'
+  },
+  twentyPercentWidth: {
+    width: '20%'
+  },
+  alignItemsCenterAndJustifyContentCenter: {
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  textAlignCenter: {
+    textAlign: 'center'
+  },
+  flexRow_alignCenter_justifyBetween: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between'
+  },
+  flexOneWithBlackBackground: {
+    flex: 1,
+    backgroundColor: 'black'
+  }
+});
+
+export default globalStyles;

package/src/assets/svg/Account.svg

@@ -0,0 +1,4 @@
+<svg width="18" height="20" viewBox="0 0 18 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M16.5995 19.007V17.0571C16.5995 16.0228 16.1886 15.0308 15.4573 14.2995C14.7259 13.5681 13.7339 13.1572 12.6996 13.1572H4.89988C3.86557 13.1572 2.87362 13.5681 2.14225 14.2995C1.41088 15.0308 1 16.0228 1 17.0571V19.007" stroke="currentColor" stroke-width="1.94994" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M8.79978 9.25776C10.9536 9.25776 12.6997 7.51173 12.6997 5.35788C12.6997 3.20404 10.9536 1.45801 8.79978 1.45801C6.64594 1.45801 4.8999 3.20404 4.8999 5.35788C4.8999 7.51173 6.64594 9.25776 8.79978 9.25776Z" stroke="currentColor" stroke-width="1.94994" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/src/assets/svg/Favourite.svg

@@ -0,0 +1,14 @@
+<svg width="20" height="20" viewBox="0 0 20 20" fill="none" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
+<mask id="mask0_105_3024" style="mask-type:alpha" maskUnits="userSpaceOnUse" x="0" y="0" width="20" height="20">
+<rect width="20" height="20" fill="url(#pattern0_105_3024)"/>
+</mask>
+<g mask="url(#mask0_105_3024)">
+<rect width="20" height="21.4706" fill="currentColor"/>
+</g>
+<defs>
+<pattern id="pattern0_105_3024" patternContentUnits="objectBoundingBox" width="1" height="1">
+<use xlink:href="#image0_105_3024" transform="scale(0.00195312)"/>
+</pattern>
+<image id="image0_105_3024" width="512" height="512" preserveAspectRatio="none" xlink:href="data:image/png;base64,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"/>
+</defs>
+</svg>

package/src/assets/svg/Upcoming.svg

@@ -0,0 +1,4 @@
+<svg width="19" height="21" viewBox="0 0 19 21" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M14.8502 6.99807C14.8502 5.52876 14.2665 4.11962 13.2275 3.08066C12.1886 2.04169 10.7794 1.45801 9.3101 1.45801C7.84078 1.45801 6.43164 2.04169 5.39268 3.08066C4.35372 4.11962 3.77003 5.52876 3.77003 6.99807C3.77003 13.4615 1 15.3082 1 15.3082H17.6202C17.6202 15.3082 14.8502 13.4615 14.8502 6.99807Z" stroke="currentColor" stroke-width="1.84669" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M10.9074 19.002C10.7451 19.2818 10.5121 19.5141 10.2317 19.6756C9.9514 19.837 9.63355 19.922 9.31003 19.922C8.98651 19.922 8.66867 19.837 8.38833 19.6756C8.10798 19.5141 7.87498 19.2818 7.71265 19.002" stroke="currentColor" stroke-width="1.84669" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/src/assets/svg/eye-off.svg

@@ -0,0 +1,10 @@
+<svg width="24" height="24" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg">
+<g clip-path="url(#clip0_105_2703)">
+<path d="M13.7977 4.88525C13.1547 4.73475 12.4965 4.65952 11.8362 4.66107C5.29772 4.66107 1.56147 12.1336 1.56147 12.1336C2.12847 13.1943 2.80466 14.1929 3.57905 15.1132M9.85595 14.1138C10.1125 14.3891 10.4218 14.6099 10.7656 14.7631C11.1093 14.9162 11.4804 14.9986 11.8566 15.0052C12.2329 15.0119 12.6066 14.9426 12.9555 14.8017C13.3044 14.6608 13.6214 14.451 13.8875 14.1849C14.1536 13.9188 14.3634 13.6019 14.5043 13.2529C14.6452 12.904 14.7144 12.5303 14.7078 12.154C14.7012 11.7778 14.6188 11.4067 14.4657 11.063C14.3125 10.7193 14.0917 10.4099 13.8164 10.1534M22.1108 1.85889L1.56147 22.4083M6.28783 17.6819C7.88452 18.899 9.82876 19.5732 11.8362 19.6061C18.3746 19.6061 22.1108 12.1336 22.1108 12.1336C20.949 9.96832 19.3375 8.07657 17.3845 6.58524L6.28783 17.6819Z" stroke="white" stroke-width="1.86812" stroke-linecap="round" stroke-linejoin="round"/>
+</g>
+<defs>
+<clipPath id="clip0_105_2703">
+<rect width="22.4175" height="22.4175" fill="white" transform="matrix(-1 0 0 1 23.0449 0.924805)"/>
+</clipPath>
+</defs>
+</svg>

package/src/assets/svg/home1.svg

@@ -0,0 +1,3 @@
+<svg width="22" height="20" viewBox="0 0 22 20" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M8.09121 12.3251V19.3375H2.69707V9.86687H0L10.7883 0.458008L21.0371 9.86687H18.8795V19.3375H12.9459V12.3251H8.09121Z" fill="currentColor"/>
+</svg>

package/src/assets/svg/profile.svg

@@ -0,0 +1,4 @@
+<svg width="19" height="19" viewBox="0 0 19 19" fill="none" xmlns="http://www.w3.org/2000/svg">
+<circle cx="9.5057" cy="4.74252" r="4.29232" fill="currentColor"/>
+<path d="M0.166016 15.6515C0.166016 13.11 2.22626 11.0498 4.7677 11.0498L13.735 11.0498C16.2764 11.0498 18.3366 13.1101 18.3366 15.6515V18.6209H0.166016V15.6515Z" fill="currentColor"/>
+</svg>

package/src/assets/svg/search1.svg

@@ -0,0 +1,4 @@
+<svg width="21" height="23" viewBox="0 0 21 23" fill="none" xmlns="http://www.w3.org/2000/svg">
+<path d="M9.2062 17.5744C13.6671 17.5744 17.2834 13.9581 17.2834 9.49716C17.2834 5.03622 13.6671 1.41992 9.2062 1.41992C4.74527 1.41992 1.12897 5.03622 1.12897 9.49716C1.12897 13.9581 4.74527 17.5744 9.2062 17.5744Z" fill="currentColor" stroke="currentColor" stroke-width="2.01931" stroke-linecap="round" stroke-linejoin="round"/>
+<path d="M19.9773 21.2783L16.2752 17.5762" stroke="currentColor" stroke-width="2.01931" stroke-linecap="round" stroke-linejoin="round"/>
+</svg>

package/src/components/Account/Account.tsx

@@ -0,0 +1,289 @@
+/**
+ * @author Naresh Dhamu
+ * @lastModified Mon 21 Jul 2025 at 12:35 PM
+ */
+
+import React, { cloneElement, isValidElement, memo, type ReactElement } from 'react';
+import { View, StyleSheet, ScrollView, TouchableOpacity, type TextStyle } from 'react-native';
+import { ChevronRight, Trash2 } from 'lucide-react-native';
+import { useTheme } from '../../theme/hook/useTheme';
+import { moderateScale, scale, verticalScale } from 'react-native-size-matters';
+import AppHeader from '../Headers/AppHeader';
+import SkeletonPlaceholder from 'react-native-skeleton-placeholder';
+import UserSection from '../User/components/UserSection';
+import TextButton from '../Button/TextButton';
+import { Text } from '../Text';
+import { useSafeAreaInsets } from 'react-native-safe-area-context';
+import type { AppTheme, ITheme } from '../../theme/themes';
+import { RFValue } from 'react-native-responsive-fontsize';
+
+type CardItem = {
+  type: 'card';
+  title: string;
+  subtitle: string;
+};
+
+type RowItem = {
+  type?: 'row';
+  label: string;
+  leftIcon?: React.ReactNode;
+  showRightIcon?: boolean;
+  onPress?: () => void;
+};
+
+type AccountSectionItem = CardItem | RowItem;
+
+type AccountSection = {
+  title: string;
+  items: AccountSectionItem[];
+};
+
+type UserInfo = {
+  name: string;
+  avatarUri: string;
+  emailOrPhone: string;
+  onEditPress?: () => void;
+};
+
+interface UserInfoTextStyle {
+  nameStyle?: TextStyle;
+  emailStyle?: TextStyle;
+}
+
+export type AccountProps = {
+  title?: string;
+  userInfo: UserInfo;
+  renderUserInfo?: (userInfo: UserInfo) => React.ReactNode;
+  sections: AccountSection[];
+  onBackPress?: () => void;
+  theme?: AppTheme;
+  isLoading?: boolean;
+  avatarComponent?: React.ReactNode;
+  skeletonProps?: Partial<React.ComponentProps<typeof SkeletonPlaceholder>>;
+  userInfoTextStyle?: UserInfoTextStyle;
+  helpText?: string;
+  clickableText?: string;
+  deleteAccountText?: string;
+  deleteAccountIcon?: React.ReactNode;
+  onHelpPress?: () => void;
+  onDeleteAccountPress?: () => void;
+};
+
+const isInvalidText = (val?: string | null): boolean =>
+  !val || val.trim() === '' || val.includes('undefined') || val.includes('Invalid');
+
+const renderIconWithColor = (icon: React.ReactNode, color: string): React.ReactNode => {
+  if (isValidElement(icon)) {
+    return cloneElement(icon as ReactElement<any>, { color });
+  }
+  return icon;
+};
+
+const getValidSectionItems = (items: AccountSectionItem[]): AccountSectionItem[] =>
+  items.filter((item) => (item.type === 'card' ? !isInvalidText(item.title) || !isInvalidText(item.subtitle) : true));
+
+export const Account: React.FC<AccountProps> = ({
+  title = 'Account',
+  userInfo,
+  renderUserInfo,
+  sections,
+  onBackPress,
+  theme,
+  isLoading,
+  avatarComponent,
+  userInfoTextStyle = {},
+  skeletonProps = {},
+  helpText = 'Need Help?',
+  clickableText = 'Click Here',
+  deleteAccountText = 'Delete Account',
+  deleteAccountIcon,
+  onHelpPress,
+  onDeleteAccountPress
+}) => {
+  const { theme: appliedTheme } = useTheme(theme);
+  const insets = useSafeAreaInsets();
+
+  return (
+    <View style={[styles.container, { backgroundColor: appliedTheme.colors.background }]}>
+      <AppHeader onBackPress={onBackPress} title={title} theme={appliedTheme} />
+
+      <ScrollView
+        contentContainerStyle={[styles.content, { paddingBottom: insets.bottom + verticalScale(40) }]}
+        showsVerticalScrollIndicator={false}
+        keyboardShouldPersistTaps="handled"
+      >
+        <UserSection
+          theme={appliedTheme}
+          userInfo={userInfo}
+          avatarComponent={avatarComponent}
+          isLoading={isLoading}
+          renderUserInfo={renderUserInfo}
+          skeletonProps={skeletonProps}
+          userInfoTextStyle={userInfoTextStyle}
+        />
+
+        {sections?.map(({ title: sectionTitle, items }) => {
+          const validItems = getValidSectionItems(items);
+          if (validItems.length === 0) return null;
+
+          return (
+            <View key={sectionTitle} style={styles.sectionBlock}>
+              <Text style={[styles.sectionTitle, { color: appliedTheme.colors.textSecondary }]}>{sectionTitle}</Text>
+
+              {validItems.map((item, index) =>
+                item.type === 'card' ? (
+                  <CardItemView key={`card-${index}`} {...item} theme={appliedTheme} />
+                ) : (
+                  <MenuItemView key={`row-${index}`} {...item} theme={appliedTheme} />
+                )
+              )}
+            </View>
+          );
+        })}
+
+        {(onDeleteAccountPress || helpText || clickableText) && (
+          <View style={styles.bottomBlock}>
+            {onDeleteAccountPress && (
+              <TextButton
+                onPress={onDeleteAccountPress}
+                style={{
+                  fontWeight: '500',
+                  color: appliedTheme.colors.error
+                }}
+                title={deleteAccountText}
+                underline
+                leftIcon={
+                  deleteAccountIcon ?? (
+                    <Trash2 size={18} color={appliedTheme.colors.error} style={{ marginRight: scale(4) }} />
+                  )
+                }
+              />
+            )}
+
+            {(helpText || clickableText) && (
+              <View style={styles.helpSubContainer}>
+                <Text style={[styles.helpText, { color: appliedTheme.colors.textSecondary }]}>{helpText}</Text>
+                {clickableText && (
+                  <TextButton
+                    onPress={() => onHelpPress?.()}
+                    style={{
+                      fontWeight: '500',
+                      color: appliedTheme.colors.primary
+                    }}
+                    title={clickableText}
+                    underline
+                  />
+                )}
+              </View>
+            )}
+          </View>
+        )}
+      </ScrollView>
+    </View>
+  );
+};
+
+const CardItemView = memo(({ title, subtitle, theme }: CardItem & { theme: ITheme }) => {
+  if (isInvalidText(title) && isInvalidText(subtitle)) return null;
+
+  return (
+    <View style={[styles.card, { backgroundColor: theme.colors.surfaceDisabled }]}>
+      {!isInvalidText(title) && <Text style={[styles.cardTitle, { color: theme.colors.textPrimary }]}>{title}</Text>}
+      {!isInvalidText(subtitle) && (
+        <Text style={[styles.cardSub, { color: theme.colors.textSecondary }]}>{subtitle}</Text>
+      )}
+    </View>
+  );
+});
+
+const MenuItemView = memo(({ label, leftIcon, showRightIcon, onPress, theme }: RowItem & { theme: ITheme }) => {
+  return (
+    <TouchableOpacity
+      onPress={onPress}
+      activeOpacity={0.6}
+      style={[
+        styles.row,
+        {
+          backgroundColor: theme.colors.surfaceDisabled,
+          borderColor: theme.colors.border
+        }
+      ]}
+    >
+      <View style={styles.leftRow}>
+        {leftIcon && <View style={styles.menuIcon}>{renderIconWithColor(leftIcon, theme.colors.textPrimary)}</View>}
+        <Text style={[styles.rowText, { color: theme.colors.textPrimary }]}>{label}</Text>
+      </View>
+
+      {showRightIcon && <ChevronRight color={theme.colors.textSecondary} size={20} />}
+    </TouchableOpacity>
+  );
+});
+
+const styles = StyleSheet.create({
+  container: { flex: 1 },
+  content: { paddingHorizontal: moderateScale(16) },
+
+  sectionBlock: {
+    marginBottom: verticalScale(16)
+  },
+  sectionTitle: {
+    fontSize: RFValue(11),
+    fontWeight: '500',
+    marginBottom: verticalScale(8),
+    textTransform: 'uppercase'
+  },
+
+  card: {
+    borderRadius: scale(8),
+    padding: moderateScale(16),
+    marginBottom: verticalScale(12)
+  },
+  cardTitle: {
+    fontSize: RFValue(12),
+    fontWeight: '600',
+    marginBottom: verticalScale(4)
+  },
+  cardSub: {
+    fontSize: RFValue(10)
+  },
+
+  row: {
+    paddingVertical: verticalScale(14),
+    paddingHorizontal: scale(16),
+    borderRadius: scale(8),
+    borderWidth: 1,
+    marginBottom: verticalScale(12),
+    flexDirection: 'row',
+    alignItems: 'center',
+    justifyContent: 'space-between'
+  },
+  leftRow: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    flexShrink: 1
+  },
+  menuIcon: {
+    marginRight: scale(8),
+    alignItems: 'center',
+    justifyContent: 'center'
+  },
+  rowText: {
+    fontSize: RFValue(12),
+    fontWeight: '500'
+  },
+
+  bottomBlock: {
+    marginTop: verticalScale(32),
+    alignItems: 'center',
+    justifyContent: 'center',
+    gap: verticalScale(8)
+  },
+  helpSubContainer: {
+    flexDirection: 'row',
+    alignItems: 'center',
+    gap: scale(1)
+  },
+  helpText: {
+    fontSize: RFValue(10)
+  }
+});

package/src/components/Account/index.ts

@@ -0,0 +1 @@
+export * from './Account';