rn-vs-lb 1.0.25 → 1.0.27

package/dist/components/footer/Footer copy.js

@@ -0,0 +1,114 @@
+"use strict";
+// import React, { useState, useRef, useEffect } from 'react';
+// import { View, TouchableOpacity, Image, Animated, StyleSheet } from 'react-native';
+// import { COLORS, SIZES } from '../../constants/theme';
+// import IconOcticons from 'react-native-vector-icons/Octicons';
+// import IconIonicons from 'react-native-vector-icons/Ionicons';
+// import MaterialIcons from 'react-native-vector-icons/MaterialIcons';
+// enum LbTypes {
+//   OCTICONS = "Octicons",
+//   IONICONS = "Ionicons",
+//   MATERIALICONS = "MaterialIcons",
+// }
+// interface Tab {
+//   name: string;
+//   iconName: string;
+//   size: number;
+//   lb: LbTypes;
+// }
+// const tabs: Tab[] = [
+//   { name: 'Search', iconName: "search", size: 22, lb: LbTypes.OCTICONS },
+//   { name: 'Organizations', iconName: "organization", size: 22, lb: LbTypes.OCTICONS },
+//   { name: 'Persons', iconName: "person-search", size: 29, lb: LbTypes.MATERIALICONS },
+//   { name: 'Chat', iconName: "chatbubbles-sharp", size: 24, lb: LbTypes.IONICONS },
+//   { name: 'Profile', iconName: "person", size: 23, lb: LbTypes.OCTICONS },
+// ];
+// const renderIcon = (tab: Tab) => {
+//   switch (tab.lb) {
+//     case LbTypes.OCTICONS:
+//       return <IconOcticons name={tab.iconName} size={tab.size} color="#475A77" />;
+//     case LbTypes.IONICONS:
+//       return <IconIonicons name={tab.iconName} size={tab.size} color="#475A77" />;
+//     case LbTypes.MATERIALICONS:
+//       return <MaterialIcons name={tab.iconName} size={tab.size} color="#475A77" />;
+//     default:
+//       return null;
+//   }
+// };
+// export const BottomTab: React.FC = () => {
+//   const [activeTab, setActiveTab] = useState(0);
+//   const tabWidth = SIZES.width;
+//   const tabW = tabWidth < SIZES.container ? tabWidth / 5 : SIZES.container / 5;
+//   const circlePosition = useRef(
+//     new Animated.Value(tabWidth < SIZES.container ? tabWidth / 2.5 : SIZES.container / 2.5)
+//   ).current;
+//   useEffect(() => {
+//     Animated.spring(circlePosition, {
+//       toValue: activeTab * tabW,
+//       useNativeDriver: true,
+//     }).start();
+//   }, [activeTab]);
+//   const handleTabPress = (index: number) => {
+//     setActiveTab(index);
+//   };
+//   return (
+//     <View style={styles.tabContainer}>
+//       <Animated.View
+//         style={[
+//           styles.circle,
+//           {
+//             width: tabW,
+//             transform: [{ translateX: circlePosition }],
+//           },
+//         ]}
+//       >
+//         <View style={styles.circleInner} />
+//       </Animated.View>
+//       {tabs.map((tab, index) => (
+//         <TouchableOpacity
+//           key={index}
+//           activeOpacity={0.8}
+//           onPress={() => handleTabPress(index)}
+//           style={styles.tabButton}
+//         >
+//           {renderIcon(tab)}
+//         </TouchableOpacity>
+//       ))}
+//     </View>
+//   );
+// };
+// const styles = StyleSheet.create({
+//   tabContainer: {
+//     flexDirection: 'row',
+//     height: 60,
+//     backgroundColor: COLORS.card,
+//     alignItems: 'center',
+//   },
+//   tabButton: {
+//     flex: 1,
+//     alignItems: 'center',
+//     justifyContent: 'center',
+//   },
+//   circle: {
+//     position: 'absolute',
+//     height: '100%',
+//     alignItems: 'center',
+//     justifyContent: 'center',
+//   },
+//   circleInner: {
+//     height: 40,
+//     width: 40,
+//     borderRadius: 20,
+//     backgroundColor: COLORS.primary,
+//     opacity: 0.15,
+//   },
+//   iconImage: {
+//     width: 20,
+//     height: 20,
+//   },
+//   profileImage: {
+//     width: 34,
+//     height: 34,
+//     borderRadius: 50,
+//   },
+// });

package/dist/components/footer/Footer.js

@@ -40,11 +40,11 @@ var LbTypes;
     LbTypes["MATERIALICONS"] = "MaterialIcons";
 })(LbTypes || (LbTypes = {}));
 var tabs = [
-    { name: 'Search', iconName: "search", size: 22, lb: LbTypes.OCTICONS },
-    { name: 'Place', iconName: "organization", size: 22, lb: LbTypes.OCTICONS },
-    { name: 'Persons', iconName: "person-search", size: 29, lb: LbTypes.MATERIALICONS },
-    { name: 'Chat', iconName: "chatbubbles-sharp", size: 24, lb: LbTypes.IONICONS },
-    { name: 'Profile', iconName: "person", size: 23, lb: LbTypes.OCTICONS },
+    { name: 'Search', iconName: "search", size: 22, lb: LbTypes.OCTICONS, route: 'SearchScreen' },
+    { name: 'Organizations', iconName: "organization", size: 22, lb: LbTypes.OCTICONS, route: 'OrganizationScreen' },
+    { name: 'Persons', iconName: "person-search", size: 29, lb: LbTypes.MATERIALICONS, route: 'ProfilesScreen' },
+    { name: 'Chat', iconName: "chatbubbles-sharp", size: 24, lb: LbTypes.IONICONS, route: 'ChatScreen' },
+    { name: 'Profile', iconName: "person", size: 23, lb: LbTypes.OCTICONS, route: 'ProfileScreen' },
 ];
 var renderIcon = function (tab) {
     switch (tab.lb) {
@@ -58,8 +58,9 @@ var renderIcon = function (tab) {
             return null;
     }
 };
-var BottomTab = function () {
-    var _a = (0, react_1.useState)(0), activeTab = _a[0], setActiveTab = _a[1];
+var BottomTab = function (_a) {
+    var onTabPress = _a.onTabPress;
+    var _b = (0, react_1.useState)(0), activeTab = _b[0], setActiveTab = _b[1];
     var tabWidth = theme_1.SIZES.width;
     var tabW = tabWidth < theme_1.SIZES.container ? tabWidth / 5 : theme_1.SIZES.container / 5;
     var circlePosition = (0, react_1.useRef)(new react_native_1.Animated.Value(tabWidth < theme_1.SIZES.container ? tabWidth / 2.5 : theme_1.SIZES.container / 2.5)).current;
@@ -69,8 +70,9 @@ var BottomTab = function () {
             useNativeDriver: true,
         }).start();
     }, [activeTab]);
-    var handleTabPress = function (index) {
+    var handleTabPress = function (index, route) {
         setActiveTab(index);
+        onTabPress(route); // Вызов коллбека при нажатии
     };
     return (react_1.default.createElement(react_native_1.View, { style: styles.tabContainer },
         react_1.default.createElement(react_native_1.Animated.View, { style: [
@@ -81,7 +83,7 @@ var BottomTab = function () {
                 },
             ] },
             react_1.default.createElement(react_native_1.View, { style: styles.circleInner })),
-        tabs.map(function (tab, index) { return (react_1.default.createElement(react_native_1.TouchableOpacity, { key: index, activeOpacity: 0.8, onPress: function () { return handleTabPress(index); }, style: styles.tabButton }, renderIcon(tab))); })));
+        tabs.map(function (tab, index) { return (react_1.default.createElement(react_native_1.TouchableOpacity, { key: index, activeOpacity: 0.8, onPress: function () { return handleTabPress(index, tab.route); }, style: styles.tabButton }, renderIcon(tab))); })));
 };
 exports.BottomTab = BottomTab;
 var styles = react_native_1.StyleSheet.create({
@@ -109,13 +111,4 @@ var styles = react_native_1.StyleSheet.create({
         backgroundColor: theme_1.COLORS.primary,
         opacity: 0.15,
     },
-    iconImage: {
-        width: 20,
-        height: 20,
-    },
-    profileImage: {
-        width: 34,
-        height: 34,
-        borderRadius: 50,
-    },
 });

package/dist/components/header/{homeHeader.js → headerHome.js}

@@ -3,12 +3,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.HomeHeader = void 0;
+exports.HeaderHome = void 0;
 var react_native_1 = require("react-native");
 var react_1 = __importDefault(require("react"));
 var styleSheet_1 = require("../../constants/styleSheet");
 var Ionicons_1 = __importDefault(require("react-native-vector-icons/Ionicons"));
-var HomeHeader = function (_a) {
+var HeaderHome = function (_a) {
     var logo = _a.logo;
     return (react_1.default.createElement(react_native_1.View, { style: [styleSheet_1.GlobalStyleSheet.flexalingjust, { height: 50 }] },
         react_1.default.createElement(react_native_1.View, null,
@@ -21,4 +21,4 @@ var HomeHeader = function (_a) {
             react_1.default.createElement(react_native_1.TouchableOpacity, { style: [styleSheet_1.GlobalStyleSheet.btnicon, { backgroundColor: '#EFF3FA' }], onPress: function () { return console.log('Components'); } },
                 react_1.default.createElement(Ionicons_1.default, { name: "filter", size: 22, color: "#475A77" })))));
 };
-exports.HomeHeader = HomeHeader;
+exports.HeaderHome = HeaderHome;

package/dist/components/header/index.js

@@ -1,5 +1,5 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.HomeHeader = void 0;
-var homeHeader_1 = require("./homeHeader");
-Object.defineProperty(exports, "HomeHeader", { enumerable: true, get: function () { return homeHeader_1.HomeHeader; } });
+exports.HeaderHome = void 0;
+var headerHome_1 = require("./headerHome");
+Object.defineProperty(exports, "HeaderHome", { enumerable: true, get: function () { return headerHome_1.HeaderHome; } });

package/dist/types/components/footer/Footer.d.ts

@@ -1,2 +1,19 @@
 import React from 'react';
-export declare const BottomTab: React.FC;
+declare enum LbTypes {
+    OCTICONS = "Octicons",
+    IONICONS = "Ionicons",
+    MATERIALICONS = "MaterialIcons"
+}
+interface Tab {
+    name: string;
+    iconName: string;
+    size: number;
+    lb: LbTypes;
+    route: string;
+}
+interface BottomTabProps {
+    tabs: Tab[];
+    onTabPress: (route: string) => void;
+}
+export declare const BottomTab: React.FC<BottomTabProps>;
+export {};

package/dist/types/components/header/headerHome.d.ts

@@ -0,0 +1,6 @@
+import { FC, ReactNode } from 'react';
+interface HeaderHomeProps {
+    logo: ReactNode;
+}
+export declare const HeaderHome: FC<HeaderHomeProps>;
+export {};

package/dist/types/components/header/index.d.ts

@@ -1 +1 @@
-export { HomeHeader } from "./homeHeader";
+export { HeaderHome } from "./headerHome";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rn-vs-lb",
-  "version": "1.0.25",
+  "version": "1.0.27",
   "main": "dist/index.js",
   "types": "dist/types/index.d.ts",
   "scripts": {

package/dist/types/components/header/homeHeader.d.ts

@@ -1,6 +0,0 @@
-import { FC, ReactNode } from 'react';
-interface HomeHeaderProps {
-    logo: ReactNode;
-}
-export declare const HomeHeader: FC<HomeHeaderProps>;
-export {};