"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
const tslib_1 = require("tslib");
const components_1 = require("@bluebase/components");
const helpers_1 = require("./helpers");
const core_1 = require("@bluebase/core");
const react_1 = tslib_1.__importDefault(require("react"));
exports.TabBar = (props) => {
    const { bottomNavigation, navigation, navigator } = props;
    const { routes } = navigator;
    const { theme } = core_1.useTheme();
    const bottomNavigationBaseOptions = {
        activeBackgroundColor: theme.palette.background.card,
        activeTintColor: theme.palette.primary.main,
        inactiveBackgroundColor: theme.palette.background.card,
        inactiveTintColor: theme.palette.text.secondary,
        showIcon: true,
        showLabel: true,
        labelStyle: {},
        style: Object.assign({}, theme.elevation(8)),
        tabStyle: {},
    };
    const baseOptions = bottomNavigation === true ? bottomNavigationBaseOptions : {};
    const tabBarOptions = core_1.merge(baseOptions, navigator.tabBarOptions || {});
    // Resolve active tab index
    const currentRouteName = navigation.state.routeName;
    const currentIndex = navigator.routes.findIndex(route => route.name === currentRouteName);
    const onChange = (_e, i) => {
        navigation.push(routes[i].name, navigation.state.params);
    };
    const TabbarComponent = bottomNavigation === true ? components_1.BottomNavigation : components_1.Tabs;
    const renderTab = (route, index) => {
        const TabComponent = bottomNavigation === true ? components_1.BottomNavigationAction : components_1.Tab;
        const options = route.navigationOptions;
        const icon = helpers_1.getIcon(options, tabBarOptions, index === currentIndex);
        const title = helpers_1.getTitle(options, tabBarOptions, index === currentIndex);
        return (react_1.default.createElement(TabComponent, { icon: icon, label: title, value: index, key: index, style: tabBarOptions.tabStyle }));
    };
    return (react_1.default.createElement(TabbarComponent, { value: currentIndex, onChange: onChange, style: Object.assign({ zIndex: 1100 }, tabBarOptions.style) }, navigator.routes.map(renderTab)));
};
