@gaddario98/react-native-tabs/dist/index.mjs

import { jsx } from 'react/jsx-runtime';
import { Tabs } from 'expo-router';
import { useTranslation } from 'react-i18next';
import { Ionicons } from '@expo/vector-icons';
import { useThemeColors, useBreakpoint, tabLabel, Header } from '@gaddario98/react-native-ui';
import { useSafeAreaInsets } from 'react-native-safe-area-context';

const TabLayout = ({ headerProps, tabs, ns = "tabs", initialRouteName }) => {
    const { t } = useTranslation(ns);
    const colors = useThemeColors();
    const { valueWithBreakpoint: mobileView } = useBreakpoint(true, true, false, false);
    return (jsx(Tabs, { initialRouteName: initialRouteName !== null && initialRouteName !== void 0 ? initialRouteName : tabs[0].name, screenOptions: Object.assign(Object.assign({ tabBarHideOnKeyboard: true }, (!mobileView
            ? {
                headerShown: false,
                // Stile modificato per apparire come un header moderno
                tabBarStyle: {
                    backgroundColor: colors.primary,
                    height: 65,
                    justifyContent: "center",
                    alignItems: "flex-start",
                    borderTopWidth: 0,
                    borderBottomWidth: 0,
                },
                tabBarLabelStyle: [tabLabel, { textAlign: "left" }],
                tabBarItemStyle: {
                    padding: 10,
                    minWidth: "auto",
                },
                tabBarPosition: "top",
                tabBarLabelPosition: "beside-icon",
            }
            : {
                header: (props) => (jsx(TabsHeader, Object.assign({}, props, { headerProps: headerProps }))),
                tabBarStyle: {
                    backgroundColor: colors.primary,
                    height: 65,
                    justifyContent: "flex-end",
                    borderTopWidth: 0,
                    borderBottomWidth: 0,
                },
                tabBarLabelPosition: "below-icon",
                tabBarItemStyle: {
                    paddingTop: 5,
                },
            })), { tabBarActiveTintColor: colors.secondary, tabBarInactiveTintColor: colors.onSurfaceVariant }), children: tabs.map(({ name, icon, title, initialParams, href }) => (jsx(Tabs.Screen, { name: name, options: {
                title: title ? t(title) : "",
                tabBarIcon: icon
                    ? ({ color }) => jsx(Ionicons, { name: icon, color: color, size: 22 })
                    : undefined,
                href,
                tabBarItemStyle: {
                    paddingTop: 5,
                },
            }, initialParams: initialParams }, name))) }));
};
const TabsHeader = ({ options, headerProps }) => {
    var _a, _b;
    const insets = useSafeAreaInsets();
    return (jsx(Header, Object.assign({ backgroundColor: "primary" }, headerProps, { title: (_b = (_a = options.title) !== null && _a !== void 0 ? _a : headerProps === null || headerProps === void 0 ? void 0 : headerProps.title) !== null && _b !== void 0 ? _b : "", style: Object.assign({ marginTop: insets.top }, headerProps === null || headerProps === void 0 ? void 0 : headerProps.style), hiddenLeftAction: true })));
};

export { TabLayout };
//# sourceMappingURL=index.mjs.map